vue模仿后台数据_Vue仿今日头条--后台网站配置文件和首页页面

script代码如下图(分析重点代码)：

调用created主要是为了获取数据对表格进行渲染：

1)获取存储的数据token、username和id；

2)判断token不存在则不执行下面代码，并跳到登录页面(解决页面太长时间不操作失效的问题)；

3)token存在则执行this.$store.dispatch('getArticleList', data)，用于调用store-article的方法getArticleList，该方法主要使用传入的参数data获取到文章列表的数据list(注意createTime使用switchTimeFormat.toDate精确到天；articleImg使用JSON.parse转为对象，因为保存时候转化为字符串；articlePraiseList使用switchTimeFormat.diffTime计算出差值)，然后执行commit('GETARTICLELIST', articles)，并利用mutations的方法GETARTICLELIST修改状态(state.articlesList和state.totalNumber)。

4)第三步执行成功后，执行语句this.list = this.articlesList.slice(0, 6)，过滤只显示前六条数据(this.articlesList对应到...mapGetters的articlesList，而articlesList是文件getters的状态获取)。

Tips：

1.articles/getArticlesList是服务器接口，具体可查看服务器文章。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！