一个“错误”的vuex写法:vuex刷新了数据但是视图没有刷新
这是个很尴尬的问题,让我猜猜看你的代码是不是这样写的:
<template>
<div id="app">
<img src="./assets/logo.png">
<button @click="clickme">点击我</button>
<span>{{countnumber}}</span>
</div>
</template>
<script>
export default {
name: "app",
data() {
return {
countnumber: this.$store.state.count,
}
},
methods: {
clickme: function() {
this.$store.commit("increment");
}
},
}
</script>
<style>
</style>那么恭喜你,无论你怎么平明点,都会是0.但是如果你是下面这种写法,那就是正确的了:
<template>
<div id="app">
<img src="./assets/logo.png">
<button @click="clickme">点击我</button>
<span>{{$store.state.count}}</span>
</div>
</template>
<script>
export default {
name: "app",
data() {
},
methods: {
clickme: function() {
this.$store.commit("increment");
}
},
}
</script>
<style>
</style>区别就是你直接关联到界面里面。为什么这样?不清楚,毕竟是别人的框架
声明:该文观点仅代表作者本人,入门客AI创业平台信息发布平台仅提供信息存储空间服务,如有疑问请联系rumenke@qq.com。
- 上一篇: 基于vue-cli的vue项目之路由1--最基本的使用
- 下一篇:没有了
