You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
129 lines
2.4 KiB
129 lines
2.4 KiB
<!--文章-详情-->
|
|
<template>
|
|
<view class="main_box">
|
|
|
|
<view class="main_section">
|
|
<view class="section_1">
|
|
<view class="titile">{{infoData.title}}</view>
|
|
<view class="content" v-html="infoData.content"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import commonApi from '@/api/common.js';
|
|
|
|
|
|
|
|
export default {
|
|
components: {
|
|
},
|
|
data() {
|
|
return {
|
|
//筛选条件
|
|
filteredData:{
|
|
id: '1',
|
|
},
|
|
|
|
infoData: {
|
|
title: '文章标题xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx111111',//文章标题
|
|
content: `
|
|
<p>aspectFit：保持纵横比缩放图片，使图片的长边能完全显示出来</p>
|
|
<p><img src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/cat-2.png" alt="uniapp" loading="lazy"></p>
|
|
`,//文章内容
|
|
},//文章详情
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.filteredData.id = options.id//发信人id
|
|
},
|
|
onShow(){
|
|
this.init()
|
|
},
|
|
//下拉刷新
|
|
async onPullDownRefresh() {
|
|
await this.getInfo()
|
|
},
|
|
methods: {
|
|
//初始化
|
|
async init(){
|
|
await this.getInfo();
|
|
},
|
|
//获取文章详情
|
|
//获取课程详情
|
|
async getInfo(){
|
|
let res = await memberApi.courseInfo({
|
|
id: this.filteredData.id,
|
|
})
|
|
if(res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.infoData = res.data
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.main_box {
|
|
background: #fff;
|
|
word-wrap: break-word; /* 允许长单词或 URL 换行 */
|
|
word-break: break-all; /* 强制所有字符换行 */
|
|
}
|
|
|
|
//自定义导航栏
|
|
.navbar_section {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: #29d3b4;
|
|
|
|
.title {
|
|
padding: 20rpx 0;
|
|
font-size: 30rpx;
|
|
color: #315d55;
|
|
}
|
|
}
|
|
|
|
.main_section {
|
|
min-height: 100vh;
|
|
background: #fff;
|
|
padding: 0 0rpx;
|
|
padding-top: 32rpx;
|
|
padding-bottom: 150rpx;
|
|
font-size: 28rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
|
|
.section {
|
|
background-color: #434544;
|
|
padding: 40rpx 40rpx;
|
|
}
|
|
|
|
.section_1{
|
|
padding: 0 24rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 30rpx;
|
|
.titile{
|
|
font-size: 40rpx;
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
.describe {
|
|
color: #999999;
|
|
padding-left: 30rpx;
|
|
}
|
|
</style>
|