00:00
好嘞,各位,那在这一小节呢,咱把todo list这个案例啊,给它改成本地存储版,我目前的案例啊,有这么一个问题,就是刷新之后啊,数据会丢失,哎,有些同学可能说老师不丢失,你看抽烟喝酒开车刷新这不还在吗?各位,这些数据是我为了把代码写下去,我写死的一些测试数据,你说对不?也就是说这些东西啊是在代码里写死的,一直在这儿呢,一个真实的场景应该是这样的,一上来没有任何的事儿需要做,等着你去添加呢,对不?各位来回来刷新,那我添加几个,你比如说吃饭再来一个睡觉同学,我添加了两个吧,来,你刷新一下走是不是丢?诶说的是这问题啊,其实也好解决,各位,就是把一堆todos要做的事往这个local storage中存一份就可以了,哎,就避免说页面刷新,数据丢失这问题了,对不?来吧各位写写吧,你说着手点在哪儿呢?啊,我们都知道哈,得往这里边存东西,那问题是什么时候存呢?对吧?啊,想想同学你说是不是得是。
01:00
这样啊,用户只要添加一个,我就得存一下,还有一个场景,各位用户可不仅仅是添加呀,用户还有可能删除呢,那你说同学,比如说举个例子啊,用户添加了八个,我问你这你得存几个,是不是得把八个存进去,那用户如果删了一个呢?那你这是不是也得删了一个呀,也就是说你这边操作的数据得和这里边存的数据完全是对应的,对不对?各位,哎,说老师,那我明白了,那就写逻辑呗,我添加的时候啊,你不是写了一个回车的那个回调吗?在回调里面我写保存的,哎,说老师,一会儿这有删除的,我在那个删除的回调里面,我再写一套逻辑,把这里的东西再给它删掉。各位,那你说你这么写是不是太麻烦了呀,是不是你写了很多套逻辑,所以说同学一个正确的解决办法,你听我说啊,应该用那个监视用watch。也就是说todos,嗯,在这儿呢,我不管你以后啊,对todos进行任何的增删改查,只要你操作了todos,我就能监视到,只要一监视到,我就拿着最新的todos so往里再存一份是不就得了?哎,各位体会体会,Watch很有用,那来吧,开始写,在这儿呢,就不能写methods了,是不?Methods里边的都是什么?添加一个todo,勾选一个的来折叠起来,我们再写一个叫做什么呢?Watch,哎,监视监视谁呢?各位你想监视谁?哎,监视todos啊,那简写形式直接写成一个函数对吧?各位啊,而且会拿到什么new value old value,我们也不需要那old value了,我们就直接拿那个new value就是value,对不?就没必要在这写两个星参一个new一个old的,对吧?就直接叫Y6好了,那接下来怎么办?就是以后只要有人对todos这个数组进行操作了,你在这儿是不是就能捕获到,那捕获到之后呢?
02:40
那这value是谁呀?操作的是谁,监视的是谁,Value就是谁呗,监视谁todos,那只要todos发生变化,那这个value是不是就是最新的todos呀?那你做一件事就可以了,各位local store age点什么呢?Set item来给他想一个key吧,比如说那叫做to do啊,那值呢,说老师那就最新的值呗,就往里存呗,各位你觉得这样行吗?不行,为啥呢?你看一下效果啊,回到这儿,这里边目前没东西是吧?来我要添加一个啊学习各位,我没敲回车呢,你说现在我敲回车的意思是不是往todos里边加的一个东西,而且你是怎么加的,各位打开你瞧是不是用了这个东西,On shift的这种东西添加view是不是可以监测得到,也就是说你的watch是可以捕获到的啊,你这是属于一个正常的添加,对不?你用的什么on shift的push等等那些方法,什么slis啥的,对不?各位能够影响原数组的好,那你看效果啊,接下来我要添加这个学习了,走你这边是正常的没问题,但是这儿为什么出错了各位,哎,因为咱们要知道每一个to。
03:40
不像它其实是一个对象,而不是一个单纯的字符串,那个名字对不?哎,所以说赶紧的把它清空掉,那你知道接下来应该怎么写了,别直接往里存怎么着,哎,咱说过jason.strange five,然后你再把这个存进去是不是就可以了呀,来看一下效果啊,刷新走,那这呢写一个学习走,哎,你看是不是存进来了,你点一下借助这去看,你看这些信息是不是都在里,那再来一个啊,比如说叫做吃饭,那同学你说如果我再按下回车,是不是又操作todos了,那是不是得到一个最新的todos,然后是不是还往里存呢?那你看敲会车,各位你看这就不是一个了,而是两个对吧,后添加的,你看在前方,哎,其实说白了各位就是把你那数组变成了一个Jason的字符串,往里边一存是吧?各位,哎,说老师那这回就妥了是吧,一刷新啊,他也不丢了,哎,我刷新呀,咋还丢呢?各位,你只做了一半的事儿,你觉得呢?同学你只是在todos发生变化的时候把东西存进去了,我问一下你什么时候读出来用了呀?哎,没有用吗?啊,那怎么办呀,读呗各位。
04:40
在哪读啊,初始化的时候不要把它写死,一个空数组对不?各位那怎么办?去local storage age中点,这回叫get item拿到谁呢?这个todos,但是你知我知你这么拿,拿的是一个Jason的字符串,你得jason.pass解析,再把它放进来对不?各位好,这回看一下效果啊刷新,你看吃饭学习是不是都在这儿了,哎,如果你再添加一个,比如说呢,叫做打代码啊,诶代码好回车添进来了吧,你看这是不是多了一个,哎,那一刷新呢,诶是不是也在啊,诶然后啊,你就觉得这功能你写完了,诶代码呢,提交上去了,诶马上测试组开了一个bug,什么bug呢?看着各位一上来应该是没有这东西的,对不对,为啥?
05:23
用户第一次用你的todo list吗?还没来得及往里边存东西呢,那也就是说他呀是不存在的,那这个时候你刷新他就会报错了,哎,各位考虑问题得考虑全面,什么问题呢?看一下控制台报错了,他说呀,不能够在none身上读取这个属性叫做LAS,而且说是F组件这块出问题了,那这是什么情况呀?各位想想,我们在上一小节跟大家说过,如果从local中取数据来看代码说吧,从local中取数据,如果取不出来啊,没有,这东西是什么呢?是nu,那nu在经过这个jason.pass的解析,是不是还是nu?那好,同学,我问你初始的todos是什么呢?不是空数组,而是一个nu,那你把这个none传给了谁呢?传给了福特,那福特在这儿是不是就得开始去进行那个统计啊,然后福特呢,就来到这儿了,就开始计算这个LS,结果发现none身上没有LS这个属性,那不就报错了吗?哎,所以说你考虑这个问题,就是第一次他使用的时候,那怎么办呀?各位啊,好解决,这么写啊,写一个或后边写一空数组,这啥意思呢?
06:23
这如果为真能用,那我就用这如果用不了,OK,那我就用这个是不?哎这么一行就给它解决了,来看一下效果啊刷新各位这回不报错了吧,空数组虽然没东西,但是我也有Les属性吧,哎,OK,回来这回再看看啊,比如说吃饭哎,睡觉哎,学习,我填了三个吧,打开这里边有没有三个有那刷新数据是不是也不丢,诶说老师那这回我就写完了,不行,还有bug,什么bug呢?你看着啊,各位用户啊,确实添加了三个,但是用户呢,把吃饭和学习啊完成了啊,然后一刷新,嗯,同学是不是丢了,为什么呀,还说老师是呢,我也监测这个秃肚子了呀,你看比如说再来一个啊,叫做玩游戏啊,老师你看这有反应啊,那难不成是我勾选的时候他不知道我勾了,对,勾选的时候他不知道你勾了,为什么呢?来看一下玩游戏是不是在这儿呢,各位你看我勾一下走这儿变吗?这是不变为什么呀?那是因为监视的时。
07:23
哦,各位,默认开启的不是深度监视,那你说刚才你在改什么呢?是不是在改对象里边的一个属性啊,人家监视默认监视的只是第一层,人家只是监视一下数组有没有发生变化,至于说数组里边的某一项的里边的属性,诶各位,人家是不是监视不到啊?所以说同学你知道应该怎么写啊,监视的时候这个todos不要写,这种简写形式要写最完整的,那就看你对之前我们讲的watch熟不熟了,对吧?完整版写法是这来写1HANDLER里边做你该做的事儿,那同样的它会收到一个value对不?哎,同学对吧,你刚才在这收value,这不也是value吗?啊,我这简写了,要是写完整是一个new value,一个old value对不对?各位好了,在这配置一个属性叫做deep,然后它的值呢是true OK,同学,深度监视开起来了,回到这儿刷新一波看效果啊,目前这个个数是不丢的,来,你注意看啊,我勾选上学习和睡觉,然后你上这边看学习,哎,为真了,这个呢也为了。
08:24
是不,哎,那你要取消呢,比如说学习取消,来打开这个学习是不是false,那这个时候同学打玩游戏,在勾上一刷新,诶东西是不是维持住了,诶这才是一个正确的解决办法,来咱试一下各位把这些东西全都清掉,一刷新必须得不报错是吧?哎,然后等着你去添加事儿,一个一,一个二,一个三,一个四,OK,刷新不美,那我把这些勾上,一刷新也不美,那我全选刷新也不美,OK,好,那这一小节呢,我们听。
我来说两句