分步表单
2019-05-23 本文已影响0人
smartHui
学习到的知识点如下:
1、ES6:解构- commit传过来一个对象,其中有两个属性。payload属性存在,如果属性不存在,则返回undefined;(图二中传的对象,是包含payload的属性的,所以这边payload对应的值就是values,即表单数据)
2、扩展运算符:构造字面量对象时使用展开语法。这里用来进行,讲已有对象的所有可枚举属性拷贝到新构造的对象中(相当于Object.assign())
![](https://img.haomeiwen.com/i11092615/507081652d28ee72.png)
![](https://img.haomeiwen.com/i11092615/9cb982e2d71c2a1a.png)
3、vuex的知识点
不直接改变store.state.count,而是通过mutation的方式,追踪到状态的变化。(实现记录每次状态改变,保存状态快照的调试工具)
通过store.commit触发mutations
![](https://img.haomeiwen.com/i11092615/fd3b30d2f4b7bc6e.png)
通过store.dispatch触发action
![](https://img.haomeiwen.com/i11092615/fa84c97a52cd5446.png)
4、async / await 当所有触发函数完成后,返回的Promise才会执行
async函数返回一个Promise对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着函数体内后面的语句。
调用async函数,会立即返回一个Promise对象。async函数内部return语句返回的值,会成为then方法回调函数的参数。
![](https://img.haomeiwen.com/i11092615/cf0d9c181e2c5a05.png)