- 添加edit.html编辑页面及相关CSS样式 - 实现内容编辑区的富文本功能 - 为item-bottom组件添加分享功能,包括复制链接和微信转发 - 更新多个组件的链接跳转地址 - 优化CSS样式,包括圆角、阴影和hover效果 - 修复部分样式问题和布局错位 - 移除不再使用的section-index.html文件
34 lines
1.3 KiB
JavaScript
34 lines
1.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 itemForum = defineComponent({
|
||
name: "item-forum",
|
||
props: {
|
||
itemdata: {
|
||
type: Object,
|
||
default: () => {},
|
||
},
|
||
},
|
||
|
||
setup(props) {
|
||
let res = props.itemdata || {};
|
||
res.content = res?.content?.replace(/\[.*?\]/g, "");
|
||
res.content = res?.content?.replace(/\<.*?\>/g, "");
|
||
res.content = res?.content?.replace(/\[.*?\../g, "");
|
||
|
||
let item = ref({ ...res });
|
||
return { item };
|
||
},
|
||
|
||
components: {
|
||
itemBottom,
|
||
itemHead,
|
||
},
|
||
|
||
template: `<div class="item-box item-forum"> <item-head :itemdata="item"></item-head> <a v-if="item.title" class="title" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">{{ item.title }}</a> <a class="message two-line-display" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">{{ item.content }}</a> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||
});
|