00:00
好嘞，各位，咱们接着优化代码，刚才啊，我们讲了map state和这个map gets去优化我们的代码，并且呢，优化完的代码啊，我给你存在这儿了，那么往下这些注释啊，我就得删一删了，想看最完整的注释呢，它在这里呢，是不好，我把这些东西都删掉，因为自己亲自手写计算属性大家都会啊，就这段代码呢，不是什么难事，我就不留着了，删掉留下来的是两个，就是map state的两种写法，一个是对象，一个是数组，好，同理我就把手写这个big sum计算属性这块也删掉了，留下来的呢是两个，一个是map gets的对象，一个是它的这个数组写法啊，那么计算属性的优化呢就结束了，诶给它折叠起来，接下来呢，我们去优化一下这个里面啊，我把这四个东西啊，一分为二，我在这儿呢，画一个分隔线，为什么分隔线要写在这儿呢？你仔细观察，上边这两个人调的都是commit，下边这两个人的都是dispach，哎，我们先考虑一下如何去优化这个commit。同样啊，你。
01:00
去观察一下这个粉色框里的代码，同学绝不觉得红色框里这一堆东西都是固定的变化的内容，只是increment这个方法名，Rement这个方法名，以及你commit的那个方法名，加，还有这个减，对不？各位，哎，你看到大写字母了，马上就得明白你在跟那个mutation对话，怎么跟mutation对话呀，你得调commit，同学觉不觉得一切都是从这个图出发的，你掉了commit才有资格跟mutations对话是不？哎，好了，回来，那能不能有一个方法帮我们生成这些代码呢？就如同那个map state和maps呢？是不？啊，有固定的东西嘛，你看都是this，点点commit都有这个好同学，那直接就跟大家说，有这么一个map啊，叫什么名呢？让你设计，你管它叫什么名呢？哎，有些同学说，老师我觉得呀，应该叫做map commit，因为你看我这写的都是commit吗？一遍两遍，那就叫做map commit吧。同学，它的设计呢，不叫map commit，来看图说话，同学你调这个commit啊，你的目的是干嘛呀，是不是跟mutations进行对话呀，所以说人家那个map，哎，叫map mutations OK，好了，给它复制过来，那同学这块怎么写呀，跟刚才的那个map state map是一个道理，点点点map mutations，然后传出一个对象，当然别忘了小逗号，来吧，同学把第一个方法名告诉人家叫什么increment，再把你commit那个方法名告诉人家什么呀，加哎，那同理再写一组rement告诉人家，那么所commit的方法名告诉人家，那么这些是不是不用写了呀？啊，他能帮你去生成了，你写的这个就作为方法名了，你写的这个加，哎，那就作为commit的那个名字了，OK，这不就写完了吗。
02:49
好了，回到页面呢，我们看看效果啊，刷新一波，哎说老师你看我选择的是一，我要点加了啊，那你加一下吧，321走，哎呦喂，各位出事了，你看啊，Mutations中的加被调用了，那你说意味着什么呢？就意味着它生成这个东西的里面一定包含着这句话，咱就这说，各位你想自己去写这个increment，你写的是不是绿色框里的代码，那人家借助这个配置项给你生成的这个increment里面应该也包含着粉色的这句话，你觉得呢，肯定是包含这句话了，如果不包含这句话，你点按钮的时候，Mutations中的这个加是怎么被调用的呀？啊，有这东西，但是好像又不太对，因为你看看页面这个位置这啥呀，0OBJECT鼠标事件完了，这是个na，哎呦，这什么情况啊？哎，说老师啊，我这有点懵了，那同学如果你自己去参考官方文档，你写的时候，你出现这问题了，我问。
03:49
一下你排查问题的方式是怎样的呢？你别光听我讲，就你自己现在遇到这个问题了，没人跟你讲，同学，你首先考虑哪儿去，我觉得应该从这出发，Mutations中的这个家呀，确实调用了，那咱们得琢磨一下，如果正常你把这一带过去了，它这应该变成一的零加一吗？但是有种感觉好像这个一它没带过去是不？各位啊，那赶紧检查一下呀，回到这个view X里面找到谁mutations中的大写的那个加对不对？各位啊，在这来一个consolo输出什么呢？前边给你来几个Dollar福做分格，然后在这写一个这个VALUE6啊，咱看看他带过来的让你加的那个值到底是多少啊，回到这儿刷新一波啊，我要加了走你，哎呀，同学，果不其然，什么呀，是一个鼠标事件，哎，这什么情况啊？各位，他好像把我的这个值给搞丢了呀啊，回到代码里，直接告诉大家是为什么啊，来把这句话呢给它删掉，知道了是这儿出的毛病，知道了是value不对，说说为啥不对啊，回到组件里直接告诉大家啊，同学你借助这个配置项。
04:53
人家确实啊，给你生成了一个increment方法啊，里边呢，也确实写了绿色框里边的这些东西，但是后边这不对，来各位听我说啊，我把这东西啊给你拿走，然后上边这些呢，你先别看啊，我给你多敲点会车来走着同学，我想要的increment是不是这个样子的啊，把这块给你掉，我想要的是不这个哎就说白了，如果我自己写，我写的是不是这种cment，那你知道他给你生成的是什么样子的吗？来各位复制我告诉你，它给你生成的那个ment，诶长这模样，Value，这呢value同学这么一对比，你就知道问题出在哪了，你自己写的时候吧，各位你是不是知道你要加几那个几其实是在N里边存着呢，但是人家去给你生成这个黄色框里代码的时候，人家确实给你生成了一个increment，但是同学人家不是人工智能啊，他咋知道你要加几的那个几是在N里面存着呢，是不，他没。
05:53
没办法了，他说那这样吧，啊，那你想加，你加紧那个几，我觉得你可能通过参数给我传过来了，诶那我就把这个参数啊直接递给mutation，让mutation加就得了。但七不知各位你这个increment是没有收到参数的对不对，你之前是靠这个自己手动写的加几的几，那同学你说这么一写，然后你再往上看，你模板里面去绑定这个increment的时候，各位你是不是没写小括号啊？诶我们之前说过view里的事件绑定，如果您不写这小括号，各位是他就不传参了吗？不是你不写小括号，它依然传参，并且传那参是啥呀？各位，嗯，大家还记得吧，是不是event，那你说你鼠标一点，这个event当然是鼠标事件了，那同学这就有意思了，你告诉mutation把数字零和鼠标事件对象相加，那可不就造成了页面的刚才这个效果吗？对不？各位啊，舒老师，那这na呢，大家都知道一个不合法的值就是not a number，你说对不，那你这些。
06:53
你乘以十，那肯定是not number啊对吧？各位，哎，那你说这个问题咱怎么解决呀？哎，就简单点说，各位你自己写的ment你心知肚明，你知道this.n就是加几的那个几，但是他不知道是不啊，可能有一些同学说，哎，老师能不能在这我再传递点什么东西，完了就让他知道去找N了呢？哎，有一些同学说老师能不能这么写呢？就比如说在这啊，Increment是加完在这我能不能再写一个什么value，什么值，完了让它是this.n哎，同学不支持这种写法啊，没有这种写法那怎么办？各位来吧，你就只能回到这儿去掉它的时候亲自把啥写好N，那老师这么写行吗？为啥不行啊？N在哪呢？VC身上的吗？这不就解决了吗？啊，来，把这些注释呢都给它删掉，这回我们就明白怎么回事了，你这么一调整，各位你信不？你那加呀就好用了，来回到这边刷新，当我点击加的时候，你瞧吗？但是你的碱它还是废的对吧，各位为什么呀？诶很简单，你的。
07:53
减，诶在这儿你是不是没有传这N呢？OK，这不就得了吗？啊来看一下同学啊，诶回到页面里面刷新一波，点击加没问题，点击减，诶也没问题是吧？各位啊，那可能有一些同学说，老师，那我明白了，就是如果我们懒惰，我们想借助这个map mutations去帮我生成这些方法的时候，那么这个里边具体的值啊，我就必须得通过这儿传进来啊，其实也不是，各位来你瞧着啊，在这儿我不喘，哎也有一个比较笨的办法，不推荐大家用啊，但是你得知道哎，Cmentment，然后接下来呢，你看着我这么写啊，各位看你能不能理解啊，这个increment我给他换一个词儿啊，叫做加加啊，然后这块呢，叫做减减同学，我就是给你制造一个不同的名字，你知道吧，哎，不是说我要加两下，不是说我要减两下啊，或者这么这么写啊，同学叫做艾特硅谷加，哎，这会儿叫做艾特硅谷减。
08:53
这回行吧，同学这么写啥意思？我这么写的意思就是借助map mutations帮我生成at硅谷加这个方法，以及at硅谷减这个方法，但是我在按钮里边用的其实还是rement和rement，对不对？各位，哎，那所以说在这儿瞧着啊，就硬写呗，也能写这是rement，这是rement，它俩都是方法，然后里边呢就有意思了，瞧着各位，我在increment里面调用它生成的at硅谷加，然后我亲自告诉他是N，然后在这儿呢，同理各位，z.at硅谷减，然后我也亲自告诉他是z.N是这意思不？哎，同学有没有这种感觉，就是靠两个函数去实现啊，点的时候同学我照样啊，我不说传什么啊，那你传的肯定是event，那你传了event在这呢，我不接收，哎，在里边呢，我调用另外一个函数叫矮的硅谷加，那矮的硅谷加是从哪来的呢？哎，是借助这生成的，这么写能不能行啊，也可以来刷新一波，走夹着啊，走减着是不也行。
09:53
哎，但是同学几乎我们不会这么用的啊同学你说如果你自己都写出来50，五十一五十二了，那为啥不自己写成这种样式呢，是不是就得了呀，对吧，各位，哎，所以说把这个呢，给它删掉，就你知道它可以这么玩的啊回来这还叫做in CT，那这呢还叫做re就可以了，那上边这块同学不变啊，那当然不变是不变，你这N呢，也得给它补回来，对吧？哎，我说的不变是方法，名字不变，Incrementrement好了，刷新一波，看一下效果啊加哎，然后减，OK，没问题好了，回来啊，那你能猜到了各位这个map mutations的作用就是来吧，写好注释啊，叫做借助map mutations帮助我们，或者这么说吧，借助map mutations生成对应的方法就可以了，然后方法中会调用谁呢？为啥叫map mutations，因为里边调了commit，方法中会调用commit去连。
10:53
系谁？诶不是联系去联系，联系谁呢？这个mutations啊，体会体会M呢，给它小写，嗯，调用commit才能去联系mutations吗？啊这是第一种写法，各位这叫什么呀？对象的写法，那同样的它也有什么呀，数组的写法，那你知道什么时候用数组的写法了，东西都是相通的，就是如果你这个词和这个词是一致的话，那就可以用数组的写法来给这个复制一份，注释呢，也给它复制一份，然后这句话呢，先临时给他注掉这块别叫对象了，叫啥数组啊，就是最主要的一点，各位map state你得理解了，随后的那些map就都好理解了，对不对，各位好了，来那这块呢，来撤回来保存一下，那这怎么写呀。
11:38
啊，同学，那你就抉择一下吧，这个数组里面写的是incrementrement还是加和减呢？来，如果我写的是increment，还有这个ment，那你考虑一下，那也就意味着你的increment有两个用途，跟刚才是一样的啊，方法名听你的叫increment，然后我commit提交的时候，那个名字也叫increment，但你这么写是不是就错了呀？因为我的mutations里面没有什么incrementrement，我的mutations里有的是加和减，对吧？各位，那所以说这块你怎么办呀？不能写mentment，你只能写加，还有什么呢？减对吧？各位，哎，如果你真想写cmentment，那你就把这里边的加和减是不是给它改一下就可以了，反正名字得对上啊，那在这呢我就直接写加，那这呢我就写减，但你可要注意，你这么一改不要紧，生成的那个加的函数不叫increment了，叫什么呢？叫加，诶，而且是大写的加，所以说同学在这你就得调。
12:39
正一下了，那加的时候就是大写的加，那减的时候就是大写的减呗，OK，回到这边呢，刷新来看效果加减对吧？哎，好了，回来，那在这呢，同学毕竟这么写有点丑是不？那所以说回来各位，我还想用这个对象的写法，哎，Increment加rement减，那在这呢，我就还可以用这两个词，Increment，这呢是rement就可以了，哎，如果说呢，你觉得这个实在难听，你可以回到这里面，你去给它改一下也行啊，那在这儿呢，我先不改，先留着它一会儿呢还有点用啊。回到这儿各位，那么这个写完了，就是借助map mutations帮我们生成对应的方法，对不对？那在这呢，写一个注释，那这叫什么呢？这叫做程序员啊，亲自写方法，完事了呗，那同学来轮到这人了，你说这怎么着，来分析吧，你掉了两次DIS4PACH，为什么掉dispach？
13:32
你想联系action对吗？所以说还有一个map map action，注意各位啊，千万不要写错，它不叫map，它不叫map dispatch，我知道啊，在那个react里边的那个技术里面，其实react里边有一个就跟咱们view里的这个view是一样的，各位都是集中式状态管理的，在react里边那个技术当中啊，确实有map dispach，但是在view里面可没有是不？哎，如果说你同时学两个框架的同学，或者说两个你都学了的同学，你可不要搞混啊，不要搞混，OK，回来叫做map actionence，那你知道接下来应该怎么做了，各位来这不要写了是吧？哎，那在这儿呢，点点点走，你怎么写呀，当然也是两种写法来先写对象写法怎么写啊，Increment o DD是你的方法名，那么你dispach的名字是加OD dispach的都是小写的对不对，各位commit的都是大写的，你看在这就可以做一个区分了啊，那在这呢，再写第二组叫做increment weight啊，所。
14:32
对应的dispatch的名字呢，就叫做加wait，这不就得了吗？同理各位如果你直接这么写你的加ODD和你的加呀，还是有问题的，为什么呢？你瞧一下效果啊，先让它变成基数，接下来我去点，不还是一个老生常谈的问题吗？你得在上方调用这两个人的时候都得传入这个N不就得了吗？诶诶，撤回来保存往下看，嗯，就是这个东西，来咱测试一下，刷新一波，来点点加，点点减啊，变成基数，然后再加，等一等再加，对不？各位都实现了，那你看是借助这个map actions实现的，当然这个呢，它也是一个对象的形式，还有一个数组的形式，把这句话先注掉，数组怎么写，各位就得是加ODD和加wait了，为什么呢？因为actions里面有的是加ODD和加wait，而不是这个什么crement o DD对不对，那所以说你真想写数组，哎，你得这么写，删掉写一数组，数组里面写上加ODD，然后还有就是加wait对吧，这回就行了啊。
15:32
当然上边你得改是不是？嗯，在这儿得改成加OTD，这得改成加wait，好了，保存回到这边呢，刷新一下，主要测试后两个，前两个肯定没问题，变成基数走你啊等一等，OK也是行的啊把注释呢给大家写好，在这儿呢，给它来一个复制，然后放在这儿啊，就是61~66，就是程序员亲自写方法，对不对啊，那在这呢，把这一堆啊都给它复制过来，那这块就叫做借助map actions生成对应方法，方法中会调用，哎，Dispach去联系ACTION4是吧，哎，把这个呢给它复制，然后往这再一放，缩进一条，这叫做数组写法，对不对？好了，OK啊，那这些呢，我把它注掉，我把这个留起来啊，因为还想叫做increment o DD，还想叫做incment wait，这不就得了吗？哎，所以说同学怎么写呀，看你是不，而且呢，还看你这里边的名字是不，嗯，好了，回来那把这些注释呢留着，那咱们。
16:32
总结一波吧，各位回到这个笔记当中四个map方法的使用，前两个我们说完了，看后两个map action用于帮助我们生成与action对话的方法，什么叫与actions对话呀？说白了就是能帮你调dispatch对不对？哎，既包含这个的函数，那同样的道理，Map mutations就是帮助我们生成mutations对话的方法，怎么与mutations对话呀，是不啊，这两段代码呢，都给大家写在这儿了，这我写了一个备注，就是map actions与map mutations使用时如果需要传递数据啊，或者说参数，那需要在模板中绑定事件的时候就传递好参数，否则参数就是那个默认的事件对象是吧？各位，OK啊，四个map方法都讲完了，同学，我问一下，不用这四个map行不行？行，日子也能过，但是你用了之后呢，会更好，对吧，那么这一小节呢，我们讲了两个人啊，一个是map mutation，一个是map actions啊那接下来呢，我就做这么一件事，这个和这个的名字复制，把这src给它复。
17:32
这一份啊，那就顶掉了，剪切板再复制一下来到这儿改个名字啊各位，叫做27_src走求和案例下划线这两个，嗯，中间呢，加一个雨对吧，好了各位，那这一小节呢，我们听。
我来说两句