<template> <view class="page"> <u-navbar :title="wordinfo.title" :border-bottom="false" :background="bgc" title-color='#000' title-size='36' height='45'></u-navbar> <view class="cont" v-html="content"></view> </view> </template> <script> export default { data() { return { bgc: { backgroundColor: "#fff", }, content: '', wordinfo:{} } }, onLoad() { this.getword(18) }, methods: { // getclass() { // this.$u.get("/app/classify/list?&parentId=111?&classifyId=114" ).then((res) => { // if (res.code == 200) { // this.classlist = res.data // let id =this.classlist[0].classifyId // this.getword(id) // } else { // // uni.showToast({ // // title: res.msg, // // icon: 'none', // // duration: 2000 // // }); // } // }); // }, getword(id) { this.$u.get(`/app/article/`+id).then((res) => { if (res.code === 200) { this.wordinfo=res.data this.content = this.replaceImgWithImage(this.wordinfo.content); } else { uni.showToast({ title: res.msg, icon: 'none', duration: 2000 }); } }); }, replaceImgWithImage(content) { // 替换所有的 为 \u00A0 content = content.replace(/ /g, '\u00A0'); // 替换 <img> 标签的宽度和高度样式 content = content.replace(/<img([^>]*)>/g, (match, group1) => { // 查找并移除可能存在的尾部斜杠 let cleanedGroup = group1.replace(/\s*\/$/, ''); return `<img style="width: 85vw ; height: auto;" ${cleanedGroup} />`; }); return content; } } } </script> <style lang="scss"> page { background-color: #fff; } .page { width: 750rpx; padding-bottom: 100rpx; .cont { margin-top: 34rpx; margin: 0 auto; width: 634rpx; } } </style>