Browse Source

小程序新闻列表图片不能自适应调整大小

master
Gao xiaosong 4 years ago
parent
commit
c2e4ec1d7d
  1. 38
      pages/shop/news/NewsDetail/index.vue

38
pages/shop/news/NewsDetail/index.vue

@ -3,12 +3,8 @@
<view class="title">{{ articleInfo.title }}</view>
<view class="list acea-row row-middle">
<view class="label cart-color line1">新闻专区</view>
<view class="item">
<text class="iconfont icon-shenhezhong"></text>{{ articleInfo.addTime }}
</view>
<view class="item">
<text class="iconfont icon-liulan"></text>{{ articleInfo.visit }}
</view>
<view class="item"> <text class="iconfont icon-shenhezhong"></text>{{ articleInfo.addTime }} </view>
<view class="item"> <text class="iconfont icon-liulan"></text>{{ articleInfo.visit }} </view>
</view>
<view class="conter" v-html="articleInfo.content"></view>
</view>
@ -71,7 +67,7 @@
-webkit-text-fill-color: transparent;
}
.newsDetail .picTxt .label:after {
content: " ";
content: ' ';
position: absolute;
width: 0;
height: 0;
@ -92,23 +88,23 @@
}
</style>
<script>
import { getArticleDetails } from "@/api/public";
import { getArticleDetails } from '@/api/public'
export default {
name: "NewsDetail",
name: 'NewsDetail',
components: {},
props: {},
data: function() {
return {
articleInfo: {}
};
articleInfo: {},
}
},
watch: {
$yroute(to) {
if (to.name === "NewsDetail") this.articleDetails();
}
if (to.name === 'NewsDetail') this.articleDetails()
},
},
mounted: function() {
this.articleDetails();
this.articleDetails()
},
methods: {
updateTitle() {
@ -116,12 +112,14 @@ export default {
},
articleDetails: function() {
let that = this,
id = this.$yroute.query.id;
id = this.$yroute.query.id
getArticleDetails(id).then(res => {
that.articleInfo = res.data;
that.updateTitle();
});
}
res.data.content = res.data.content.replace(/\<img/gi, '<img style="width:100%;height:auto;"')
that.articleInfo = res.data
console.log(that.articleInfo)
that.updateTitle()
})
},
},
}
};
</script>

Loading…
Cancel
Save