解决vue后台请求的数据,需要手动刷新页面才能显示
解决vue后台请求的数据,需要手动刷新页面才能显示
·
当我们做一个分类标签的时候。比如这个样子的每个分类请求的数据不一样。我们在生命周期mounted钩子函数中通过axios请求到了数据。但是需要手动刷新页面,数据才会显示。怎么做才能不用手动就可以自动刷新呢。其实非常简单……步骤如下:
1、通过mounted钩子函数获取后端数据
2、页面刷新问题。vue中有3种方式刷新页面
this.$router.go(0) location.reload() provide/inject
这里我们用this.$router.go(0)方法
3、点击分类标签自动刷新问题。
我们只需要找到分类标签在上面加上一个点击方法然后让其刷新即可。
<el-menu-item v-for="cate in categories" :key="cate.id" :index="cate.id.toString()" @click="newLink">
<i class="el-icon-menu"></i>
<span slot="title">{{ cate.name }}</span>
</el-menu-item>
.
.
.
<script>
export default {
name: 'index',
data(){
return{
categories: '',
}
},
mounted(){
this.$axios.get('后端url连接').then('数据请求成功处理').catch('数据请求失败处理')
},
methods: {
newLink(){
this.$router.go(0)
}
}
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)