- 添加详情页(details.html)和个人主页(homepage-me.html)的完整功能实现 - 新增多个图片资源用于UI展示 - 优化item-head、item-bottom等组件的数据绑定和交互逻辑 - 添加公共工具函数(public.js)包括时间处理和网络请求 - 完善CSS样式文件,增加响应式布局和交互效果 - 实现用户信息展示、帖子详情、相关帖子推荐等功能模块 - 添加签到、投币等交互功能 - 优化组件模板结构和数据传递方式
39 lines
2.3 KiB
JavaScript
39 lines
2.3 KiB
JavaScript
// my-component.js
|
||
// 引入全局 Vue 对象(因在 HTML 中通过 script 引入,Vue 已挂载到 window)
|
||
const { defineComponent, ref } = Vue;
|
||
import { itemBottom } from "../item-bottom/item-bottom.js";
|
||
import { itemHead } from "../item-head/item-head.js";
|
||
|
||
// 定义组件(直接使用模板)
|
||
export const itemTenement = defineComponent({
|
||
name: "item-tenement",
|
||
props: {
|
||
itemdata: {
|
||
type: Object,
|
||
default: () => {},
|
||
},
|
||
},
|
||
|
||
setup(props) {
|
||
let item = ref({ ...props.itemdata });
|
||
// item.value.title = "【投41票】" + item.value.title;
|
||
// res["timestamp"] = util.strtimeago(res.release_at, 4);
|
||
// const data = res.data;
|
||
// const option = data.option || [];
|
||
// res["isvote"] = option.some((item) => item.selected == 1);
|
||
// const time = util.handleDeadline(data.deadline);
|
||
// res["time"] = time;
|
||
// this.setData({
|
||
// item: res,
|
||
// });
|
||
return { item };
|
||
},
|
||
|
||
components: {
|
||
itemBottom,
|
||
itemHead,
|
||
},
|
||
|
||
template: `<div class="item-box item-tenement"> <item-head :itemdata="item"></item-head> <div class="title">三房找一位室友合租,家具设备齐全</div> <div class="site-box flexacenter"> <template v-if="item.intermediary == 6"> <div class="site-item flexacenter" v-for="(item, index) in item.location" :key="index"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/room.png"> {{ item }} </div> </template> <div v-else class="site-item flexacenter"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/orientation.png"> {{ item.location || '九龙 > 尖沙咀/佐敦' }} </div> </div> <div class="price-section flexacenter"> <div class="unit">HK$</div> <div class="price">{{ item.rent }}</div> <span class="text">/月</span> <div class="rentalduration">[ 租期{{ item.rentalduration }} ]</div> </div> <div class="picture flexacenter"> <img class="picture-item" v-for="(item, index) in 15" :key="index" src="https://axure-file.lanhuapp.com/md5__34fc6e5f5fef1d31bbd4604d33be77cc.svg" alt=""> </div> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||
});
|