优化用户体验

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

View File

@ -22,6 +22,7 @@
</div> </div>
</header> </header>
<div class="main container"> <div class="main container">
<div v-if="isError == false" style="display:none" :style="{display:a.id > 0 ?'block':'none'}">
<h1 id="article-title">{{a.title}}</h1> <h1 id="article-title">{{a.title}}</h1>
<div id="artilce-info" class="show-flex"> <div id="artilce-info" class="show-flex">
<div class="category">分类:{{a.category}}</div> <div class="category">分类:{{a.category}}</div>
@ -33,6 +34,14 @@
</div> </div>
<div id="article-content" v-html="a.content"></div> <div id="article-content" v-html="a.content"></div>
</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>
</div> </div>
<!-- 引入vue库 --> <!-- 引入vue库 -->
<script src="./vue/dist/vue.js"></script> <script src="./vue/dist/vue.js"></script>
@ -48,8 +57,9 @@
el: '#detail', // 设置挂载对象 el: '#detail', // 设置挂载对象
data() { data() {
return { return {
isError:false,
a: { a: {
"id": 1, "id": 0,
"title": "", "title": "",
"cover": "", "cover": "",
"publish_time": "", "publish_time": "",
@ -65,14 +75,14 @@
async created() { async created() {
const params = qs.parse(location.search); const params = qs.parse(location.search);
if (!params.id) { if (!params.id) {
alert("文章的编号不正确") this.isError = true;
return; return;
} }
const id = params.id; const id = params.id;
await request('./api/article/web/update', { id }) await request('./api/article/web/update', { id })
const articleList = await request('./api/article/web/detail', { id }); const articleList = await request('./api/article/web/detail', { id });
if (articleList.length != 1) { if (articleList.length != 1) {
alert('文章数据有问题'); this.isError = true;
return; return;
} }
this.a = articleList[0]; this.a = articleList[0];