58 lines
1.3 KiB
Vue
58 lines
1.3 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="title">
|
||
<span>{{ vdata.record.title }}</span>
|
||
</view>
|
||
<view class="updatedAt">
|
||
<span class="author">作者：{{ vdata.record.publisher }}</span>
|
||
<span>时间：{{ vdata.record.updatedAt }}</span>
|
||
</view>
|
||
<!-- mp-html 会有横向滚动条问题 所以采用v-html -->
|
||
<!-- <mp-html :content="record.content" /> -->
|
||
<view v-html="vdata.record.content"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive } from 'vue'
|
||
import { reqLoad, API_URL_SYS_ARTICLES } from '@/http/apiManager.js'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
|
||
onLoad((options) => {
|
||
reqLoad.getById(API_URL_SYS_ARTICLES, options.id).then( ({bizData}) => {
|
||
vdata.record = bizData
|
||
})
|
||
})
|
||
|
||
const vdata = reactive({
|
||
record : { }
|
||
})
|
||
|
||
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.content {
|
||
box-sizing: border-box;
|
||
padding: 0 50rpx 40rpx 50rpx;
|
||
.title {
|
||
// height: 60rpx;
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
font-size: 35rpx;
|
||
padding: 20rpx 0;
|
||
font-weight: 700;
|
||
color: rgba(0, 0, 0, 0.8);
|
||
}
|
||
.updatedAt {
|
||
padding: 0rpx 0 40rpx 0;
|
||
color: #969696;
|
||
font-size: 20rpx;
|
||
.author {
|
||
margin-right: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|