088-尚硅谷-尚品汇-登录业务中讲解存在问题‘

好，各位同学，那咱接着继续。在接着继续之前呢，咱们呢做一下笔记。咱们首先说呢，刚刚做了一件事，什么事。这块要注意啊，咱先从登录这块来说。那这块呢，一定要注意，这是登录的路由组件。那咱们也去找到对应的代码，咱们呢，也去做一下笔记看着啊。在登陆这里咱曾经做过的一些事，你看。你是敢输入用户名。输入密码，点击登录。你是不是要发请求？你要告诉服务器大哥。兄弟，我要登录。服务器看，诶，你找的房你注册过了能等。返回给你一个头，是不是这一刻你派发的这个action是不是才返回头。对不，就这块咱写一下。咱们现在遇见的一个情况就是什么，一个个来，第一个1.1。

就是当用户。啊，前提是不是已经注册过了，就是当。用户注册完成，他要干啥，是不是要登录了，就是用户咋的啊。用户登录，那用户登录老说你在携带着什么上去。什么？头天吓死我了。用户登录是不是通过这个用户名。加谁加逆方是不是像？服务器发起去。对不？而且咱们当时发请求用的是不是这个action user login？对不对啊，那咱写一下就是括弧组件。派发啥？派发action叫什么？叫user？Logo in。那仓库是不是就给咱发请求了？

对不，那咱找一下咱当年那个仓库在这儿，是不是在这儿叫有点。看登录啊，看登录。咱们先把没用的地儿先给他打。先劝导给他折上看。登录这。你看。对，比如说你一点击按钮，我是不是触发这个。那我是不是要向服务器发请求？老师，你这个对是。带的是用户名和密码返回结果，结果等于200。你登录成功了，你登录成功。咱们是不是能拿到付款。对不？所以说老师也做一下笔记啊，比如说用户登录向服务器发请求，登录成功。登录成功，咱干一件什么事？是不是获取到啥token，你要注意这个token是在什么时候获取，是派发这个user in这个action。

对不？那获取突克咱又做了一是啥事，存储于谁？仓库当中。但一定要注意这玩意是非持久化。对不？而且你还要注意存完通肯存完操刀咱又做了一件啥事，是不是路由。跳过跳到哪去？跳转到后首页，老说你到后首页的时候我问你。仓库当中有没有同款？有，而且咱们是不是写在图上。啊，完了，因此。在首页当中。在哪是want的？Mount moned mount派发上。X哪个X接近？咱也不知道，咱咱再找一下。叫。长相是哪也是后。换回事。陈。叫啥叫get user info。

对不对，哎，派发这个X。那你要干什么？是获取用户信息，但老师问你，当从log转到后，我问你有没有？仓库当中有没有有，你能不能获取用户信息。按派发action获取什么？获取用户信息没问题。以及。是不是动态的展示he组件的内容？有还是没有显示谁对不对。但是现在咱们遇见的一个问题是什么问题？不刷新。谁没了？因为现在老师现在回到首页，只要老师一。就是一刷新。后首页。你会发现首页。获取不到。获取不到。用户的啥信息，为啥谁买。同恨，因为什么？因为V差是非持久化，分数就现在到这给我跟上。

那你说咱要做什么？你是不是要持久的。也就是说，当你见到ton的第一面的时候。你还要做一件事，不仅仅说要把仓库当中的那个要进行修改。你还要立马做一。持久化存储动态。你想到谁本地存储？对吧，那所以说咱回首要做这件事，哪件事持久化存啥。开。线下持久望穿出这个OK，那咱们得先找找，先找找来。老说你咱是在组建当中，建到头还是仓库。仓库啊，在哪就在这。看这是昨天写的代码，但是你再回看应该能看懂吧。你这是在提交。

就是这块呢，咱已经咋获取到了啥。就是用户已经。登录成功。且早的获取到谁投肯那老师问你，你还要做点啥事？本地持久化存储。对不，所以这块你要干什么，你想在这提交款了，是不是代表通过已经有了我19万。存住，谁都开。对。那写很简单，Local storage点。Item起个名字KV的形式吗？Token老师说你token本身就是字符串用出口啊。不用存谁。Resolve点对点。对不？正常人这么写是不是就完了？但是有一些程序员非要。

装逼。就是把这个函数你说白了，Story是不是一个函数的调用。他非要放别的文件夹里。OK吗？啊，就说白了，把这行代码在外头在伪装一个啥数条，这能懂做的活是咋的一样。这能懂，不但现在老师问你一件事，就算现在老师现在咱咱不写别的，我就现在现在问你老师现在是持久化存储，但老师一刷新有吗。那先把这些事先想明白，137。三四五六七八九十十一走，123456走。我一刷新。还是没有，你只是存在。我又没用呢。这个走。能吧，那在咱咱先不管这事，咱是不是存了，有一说一存没存，存了你看看咱涨价谁。

Application。走一走。了吧，但你没用了啊啊好了，但是有的时候有一些成员他不这么搞。他怎么搞怎么搞。他在里面封装一个模块，专门处理谁。OK吗？啊，只不过把咱刚刚那代码咋的。哎，放个比个地儿。咱这块呢，给他起个名叫啥叫偷。调。GS专门处理谁是不处理偷分？那你说咱刚刚那行代码老说你要干啥。说本地存储持久化存储，一个它就是无非老师问你需要对外打。哎，对外暴露一个啥函数。Export car。比如咱起个名叫。是吧，设置。是一个箭头函数。先琢磨琢磨要不要全餐？

右边有。我用的时候你是给我。你不给我，我存啥呀。那不存了个G吗？对不，所以里面代码还是一样，叫local storage.side。K叫token，那他存上偷这老师这玩意哪来的？刑残。这叫啥？这能懂？其实做的还是还是一样，只不过他给你绕了个。啊，绕了个弯，所以说将来人家写这样代码，你得知道怎么回事。这能懂不？那也就是说你需要回到哪？仓储到这儿。眼神是不是引那个好处。盐。Part叫啥叫S？For。不提示爱的杠。Utils下的。

是不是偷？那说白了，咱只需要把这块代码。说换一下叫啥。S token。Thought。第二，date.token我问你做的事是不是一样。哎，这能懂吗？哎，格式化的行。好。那咱们回首再测试一下子，现在虽然起了，但是跟没写还是没啥区别，你只是存了，还是那句话，那这你得琢磨琢磨，你看啊，我是来个幺三七三四五六七八九十十一走123456登录。看这有没有存。走了吧，但你一刷新。还是没有。你是左了，但你发的请求你根本没有带。对不？哎，还记不记得咱当年请求拦截器这。捞数据的时候是不是也是从这。

收仓库。那老说你说现在一刷新仓库当中这个没了，你说是对还是不对。对对对。对不对，你看当你一登录的时候，你要想明白一件事，当你一登录的那一刻。你是不是先提交poke？T提交到。到这儿。修改这个空串。变成真实的付款对不对？以及本地存储是不存类。那老师你再刷新的时候，你还能这么好。我说你再刷新的时候，这还能这么想？不能，你得从哪报？本地存储。对不？对不对，咱就举个例子，老师问你啊，你先把这先给我抢走，我就先在这住了，我说本就假如本地存储没存。你就先把这个班先给绕过来，老师先把这也先给他打，先给他清了。

就是现在是根本没有本地存储这个功能。就举个例子啊，我说你。你看这儿。就比如说用户点击登录来幺三七三四五六七八九十十一走，123456走没问题。这个空窗。是不是由一个空串变成一个真实的token，说白了是随机字符串。这没问题吧？哎，没问题吧。那老说你啊，你说假如起始这个空号，我现在变成变化叫local storage.get。咱叫啥叫头肯？再去研究研究。就这老师都给他干掉了，咱先咋的？先不要。你看这儿我说你啊。你先读嘛。现在始态市场。诶，对不对。跟空串有区别？

没区别的，你想想storage.get item通过可以得到V，咱现在没我都删了底代码我是不是都删了。我看到哪去了，这这这我是不是删了，那么老师问你本地存储根本就没有存过这个字段。对不对，那起始状态相当于这个图快，跟空串有区别，没区别，只不过它起始是啥声呢。这能同工？能不能走，能把那你看咱还是先琢磨，你把这先琢磨明白，你看先说。我现在幺三幺三七三四五六七八九十十一。123456，当老师点的这一刻。我没点到，今晚假如说点了拿没拿到特。拿到了吧。有没有修改图？有，那也就是说由谁。由那就变成真实的。

但是老师如果存了，下一次再刷新，假如说存了。是不是从本地高。这能绕过来。这能绕过来不？比如说你这块假如说没存起始状态，谁是不是忘了，那你当你一点击这个按钮，你看一点击这个按钮是派发action。有没有获取到服务器的脱口有你是不是三连环？修改由那变成了谁？是不是真实的口感？对不？对不对，那现在老师问你啊，现在老师没存跟没是还是一样。看1371373。四五六七八九十十一走123456，我现在一登录，你看是不是由那变成了真实的。再看一下。看这是不是有那变成真实的图片，但我一刷新，还是它。还是没这个漏。

找一下。这能懂不？怎么搞知道吧，那所以说。那如果说你这儿存了呢。你下一次刷新是不是就从本地存储拿了在南方岛啊，所以这块咱咋了持久发。存储谁偷看这块就啥叫S。把头Ken传谁点？呃，贝点谁OK对不？你看咱这回再玩一下刷新。来看这啊走老师给你来一个幺三七三四五六七八九十十一走123456走。没问题吧？还是没为啥。取的那个token不对吧。好讲，都看见了，不告诉一声，看这啊，咱这是什么写，大写啊，白写。

好，那这块咱给他搞个谁to。KN，好，回首在哪里？这给它打轻了，直接给他倒走，再测试一下刷心啊，是走。137。三四五六七八九十十一密码123456246对走你。对不？对不对。对吧，那是不是就持久化存储。有没有问题？没问题吧，比如说你要注意他是假如没存拟是空是不。就相当于跟咱写写那空的时候没区别，但是你要注意下一次刷新的时候，我问你存没存。存了，你是不是从本地存储里。这儿的model。能不能让我来？可以吧，你看这就持有化。但是有的人他这块代码他能这么写。

对，再放一个。就这咔嚓断了。放这儿。X po cost，咱点啥叫get？老师问你用穿插吗？要吗？不用吧，你这块老说你要不要返回值。Local storage.get谁？脱裤。这能懂不？所以说这两个函数一个是啥？存储投另外一个获取。对不，那所以说这块呢，你得咋引入，这叫啥。对不，那这块你得换成谁get token加谁。小括号。所以说你看现在有没有。

有吧，感觉一切都这么完美。但是。我是不是跳到四尺。又没了。你看我回到home当中没问题。为什么？你home是没问题，但为什么一定要用search就完蛋？为啥？为啥？因为咱们现在是不是一直在哪儿呢，在。在这个home当中。你一直是不是只要你刷新，是不是从半数在获取用户信息。而你在search。低碳。购物车是不是都没有写？对不？对不对，对吧，当然说老师，那我知道了。咋的？

哎，我在所有的。路由组件当中，比如说那个那个叫啥来着，下一个叫设置，这我也打。哎，这这能懂吗？我也写，但你感觉。他他这个不。你说对，还真对。你说累不累？是真的，你看吧，你现在老师给你写的啊，早现在我听到40，我一刷新，你看有没有。张琪。来重新给他。说卡了。一会你看老师这儿呢，重新搞一下刷新，这没网了呢。来这我重新发一下。我这个流量他也不给力。你看走先，老师问你是不是连自动都做好。为啥？因为头发里边，因为本身存储，你看咱看这样你看。是不是也OK了，但是。

看这我是不是跳到底碳了。右边这能能走。那有同学老师，那这个讲多简单啊。在所有的组建的时候，我都要一直只要是获取用户信息。那你想这么写？好吗？有点不好吧。首先说。你模块多了，你每一个都来一个。啊，现在老师问你啊，知不知道为什么一刷新没了，这能理解吧？因为你需要快发I只是获取用户信息，但是你现在只有home和色置型的，但是像其有这种微写。我说你，你说你要这么写荣誉。类似。那你们能不能想到一个好一点的解决方案？哎，有的同学说的很对。在哪？在APP。

APP老师问你只挂了几次？一次。对不对。诶，对不对，对吧，但是还是有你看啊老师先在这咋的。看着老师把谁的把这块，我先把这块砖水是不是色差我干掉。你看啊，老师再把谁给干倒？刚刚有个同学说，老师我知道放在哪，放在哪。P。那咱看一下对不对。很对呀。感觉差不多。但是。不是最完美的，你看啊，老师给你测试一下。咱们得知道APP老师问你只挂了几次。挂在一次这没问题吧，来看这啊走，因为你先把挂载完一次之后，仓库当中里面是不是就一直有这个这个这个这个这个这叫啥来着。来看这吧，先先看一下老师，先给他打，先给他清了。呃，等会儿啊。

Application这我就清了，走，咱试一下子走。我告诉你，要放在APP里面，问题更大。啥问题你看。来看这。看着走。现在老师问你。APP组建的有没有执行。执行完了，你看看点log老师给来个这个啥APP。你看啊。现在老师是不是没登录呢，我说阿新。APP执没执行完。执行了。在线的师，你能获取用户七七吗？诶，能获取用户信息吗。能还是不能？不能，为啥。你没登录呢，你怎么拿到token呢，对不好，那老师问你走。大家我要登录了，幺三七三四五六七八九十十一走123456。我说你一点击登录，跳到后面能获取用户信息吗。

或者为什么？APP只只有几次，一次。但是你一刷新。能不能获取到？一刷新能不能？能为啥，因为你LOGO320是不是已经有了，一刷新是不是才有。但是你看啊，但是它的好处是啥，你看。所有都有。除了谁？除了。第一次你说这么写他行吗？他也不行。对不对，说老师那我知道了，而现在我给你放在这，这能理解吗。哎，能理解。给个回音可以吧，但是我是这么写吧，你看如果每一个组都写点。可以，但是累，放在APP里边很尴尬，第一次还是没有。好，那也就是说这两种解决方案咱都有。

OK吗？啊，那也就是说现在老师把这个获取用户信息就先给他打了。干掉，咱还是先放在那。Home。啊，这个问题咱要解决，咱还是放放在这。啊。除了这个问题之外，还有。老师给你讲。这老师重新登录一下，这还有问题。你看老师问你是不是已经登录。你还能回？老。就是已经登录过了。用户还能回老。再登录。不是停停，咱咱想这个业务逻辑，你已经登录了用户，比如我手贱。我就输入老弟。还能回来吗？你认为该不该补？所以说还有很多活要做。OK吗？

第一件事是什么？咱们现在存留的几个bug。来看这儿。第一个bug是。来持久化存储改是不是已经做了啊，这标一点几一点几1.41.5，咱们现在存在的一个问题，就是存在的问题一什么问题。就是每一个组件当中。他是不是假如说隐形动物是不是都得获取到用户信息。对不对。A，对不对？但是你需要每一个组件里边都要写谁，是不是写那个action，就这玩意。对不，所以这边老师跟你讲，这是咱存在的第一个问题，什么问题就是呃多个组件。多个组件要展示用户信息需要哪个？需要在每一个组件的。MOU。

NTD中触发谁？是不是触发这个action。但是这种方案你感觉好？我说老师还行。那假如说咱有100个呢。他100是吧，反正也行啊，你要是时间时间充裕对吧，你每一个主要呼一下小方铁是或许。是吧，啊，所以这种解决方案好吗？不行。对吧，以及咱们刚刚也说了，你放在APP里面。也不行，第一次登录是不是有问题对吧，所以这是咱存留的一个问题。那也就是说，咱将来要解决的一个问题是什么？你只要进行路由的跳转。前提是啥？是用户信息已经有了，我是展示。你只要就比如说你从跳到谁跳到这个这个这个这个这个叫前几是用得有。有了是不是就展示。对不没有就在哪，是不是请求。哎，这往走。比如说咱将来要解决的一个问题是什么问题，就比如说从路由进行路由跳转的前提是啥？

用户信息必须得有。你才能跳。这能懂不啊？这是这个问题，还有个问题是什么问题？第二个。一存在的问题。问题二，什么问题？用户已经登录了，你还能再再再回首登录吗？哎，老说你见过哪个网站说你已经登录了。完了，你回去还能跳，不可能吧？哎，对不对。对吧，所以说用户已经登录了，就就不应该咋的。再回登录页。对不，所以这两个问题咱是要解决的，最后去解决。OK吧，因为这玩意需要涉及到一个东西叫啥。大方是还没选。OK吧，但是现在咱们可以解决另外一个小小小问题，什么问题？

退出的。老师说你退出登录，你要干什么？老师讲，第一个你要退出登录，第一个你是不是通知服务器我退出登录了。他得把这个相应的token是不是得清了，你自己本地的N和用户信息是不是全要清。全都清空。对不对，对吧，所以说咱们先把这件事，这个简单的事情给他做退出。登录，那你是不是还找到这个按钮。对不，那咱找这个按钮在哪。咱们找一下这个老师。