优化用户体验

This commit is contained in:
LittleBoy 2022-05-12 11:09:53 +08:00
parent 07ba7c016e
commit b3dea14708

View File

@ -22,16 +22,25 @@
</div>
</header>
<div class="main container">
<h1 id="article-title">{{a.title}}</h1>
<div id="artilce-info" class="show-flex">
<div class="category">分类:{{a.category}}</div>
<div class="time">发布于:{{a.publish_time}}</div>
<div class="count">
阅读数({{a.view_count}})
评论数({{a.comment_count}})
<div v-if="isError == false" style="display:none" :style="{display:a.id > 0 ?'block':'none'}">
<h1 id="article-title">{{a.title}}</h1>
<div id="artilce-info" class="show-flex">
<div class="category">分类:{{a.category}}</div>
<div class="time">发布于:{{a.publish_time}}</div>
<div class="count">
阅读数({{a.view_count}})
评论数({{a.comment_count}})
</div>
</div>
<div id="article-content" v-html="a.content"></div>
</div>
<div v-else class="error-notice">
<el-result icon="info" title="提示" sub-title="加载文章数据异常">
<template slot="extra">
<el-button type="primary" round size="medium">返回</el-button>
</template>
</el-result>
</div>
<div id="article-content" v-html="a.content"></div>
</div>
</div>
<!-- 引入vue库 -->
@ -48,8 +57,9 @@
el: '#detail', // 设置挂载对象
data() {
return {
isError:false,
a: {
"id": 1,
"id": 0,
"title": "",
"cover": "",
"publish_time": "",
@ -65,14 +75,14 @@
async created() {
const params = qs.parse(location.search);
if (!params.id) {
alert("文章的编号不正确")
this.isError = true;
return;
}
const id = params.id;
await request('./api/article/web/update', { id })
const articleList = await request('./api/article/web/detail', { id });
if (articleList.length != 1) {
alert('文章数据有问题');
this.isError = true;
return;
}
this.a = articleList[0];