Vue刷新页面
在vue项目换肤制作中,说到了,点击切换ID来实现品牌数据的替换,但是有一点,我们的id是通过vuex中来计算的到的,这样只有在页面刷新的时候才能获取最新的ID,这就需要我们在每次点击按钮切换的时候,都要刷新当前页面。
我们可以通过在app.vue中绑定reload事件,通过provide传递出去。如下:
通过切换RIgthNav的显示隐藏来调用需要切换的页面。
现在我们需要在需要使用reload的页面中注册事件,然后在页面中就可以调用this.reload
了。
export const LoadingMixins = {
data() {
return {
loading: true
}
},
// 在当前页面注册reload事件。
inject: ['reload'],
methods: {
showLoading: function() {
this.loading = true
},
hideLoading: function() {
this.loading = false
}
},
computed: {
brandId: function() {
return this.$store.state.skin
}
},
}
这里我们可以稍微优化下,因为我们所有能切换品牌的页面都需要注册,所以,我就直接将这个方法注册,放入了mixins中,在mixins中,我还实现了页面加载的显示隐藏,这里可以在以后的文章中说明。