vue在html如何写箭头函数,vue中的方法 methods 定义时不要使用箭头函数

今天在vue中引入vuex的时候出现了错误,解决了一个多少时,总结如下:

vuex 的使用:

vuex就是一个状态管里中心 也好比一个仓库

细分可分为五个部分,这是我不考虑 module

分别是 state geters setter mutations actions

state 就是要存入的数据

getters setters 就不用多说的,是获取和设置数据用的

mutations  是可是操作 state中数据的一个层  在vue中用 commit来调用   用来 同步 同步 同步写入数据

actions  是用来操作 mutations的 在 actions中可以进行异步操作,如发送一个url请求,得到返回数据 再调用 mutations来写处理返回的数据到 state中 可以说是一个异步 异步 异步的写入的  在vue中用 dispatch  来调用 mutations

69df18cd3997358ffe1b18b84d0e2e27.png

上图是vuex的推荐目录

在store.js中引入 state.js  mutations.js actions.js

如下图

actions.js

4d2e7aa81595869a722dbfbef365c2d3.png

state.js

b48d237ea6d9ec48225fbb5dec09d48f.png

mutations.js

00c21fcfdb5e5c6370e69f1488ae1eda.png

store.js

60e2cda775ab12cea92c796046c3e11e.png

完成之后在 main.js中引入

b549f048a8e4690aefe311dfcd6c5f39.png

这样就可以在任意组件中使用 store了    js中的使和方法是 this.$store.state   this.$store.commit  this.$store.dispatch

template中使用方法是 {{$store.state.paramname}}

这里要说一个注意的地方 其实vue的文档中已级作了说明,就是在 vue的 methods中的方法定义的时候不要使用 箭头函数 如果使用的话, this 的指向就是错误的 具体原因在文档中

7e7b82c980c10e7709ab5e9fd9d5bb1c.png

我就是在写方法时使用了 箭头函数,导到 this.$store 是一个 undefined ,错误找了一个小时

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值