V01 Vue.js 实战教程 - 基础篇8.3. 完善数据显示
简介
本小节中，我们将完善数据的显示，需要完善的页面包括网站首页和个人专栏相关的页面。
首页帖子的显示
1、打开 src/views/Home.vue 文件，修改 computed 选项：
src/views/Home.vue
computed: {
...mapState([
'auth',
'user'
]),
articles() {
return this.$store.getters.computedArticles
}
},我们这里删除了 mapState 中的 articles，并使用派生状态 computedArticles 作为所有文章。
2、查找 <router-link v-if="user"，修改帖子列表中头像的结构：
src/views/Home.vue
<!-- 修改 -->
<router-link v-if="user" :to="`/${user.name}`" tag="div" class="avatar pull-left">
<img :src="user.avatar" class="media-object img-thumbnail avatar avatar-middle">
</router-link>
<!-- 为 -->
<router-link :to="`/${article.uname}`" tag="div" class="a...
关于 LearnKu
粤公网安备 44030502004330号