js中的this指向问题

最新推荐文章于 2024-01-31 09:21:30 发布

9233

最新推荐文章于 2024-01-31 09:21:30 发布

阅读量319

点赞数

文章标签： uni-app vue.js localStorage

本文链接：https://blog.csdn.net/weixin_45325750/article/details/102609698

版权

博客讨论了在Vue.js应用中遇到的this指向问题，特别是在使用localStorage和自动填充功能时。作者发现this.password并未正确更新data模型，通过大佬的建议使用let that = this来保存正确的上下文。文章提到了在axios异步请求中也曾遇到类似问题，并表达了对代码安全性的思考。

摘要由CSDN通过智能技术生成

js中的 this指向问题

这是什么
本文仅记录我寄己在初次使用uni-app做app开发所掉的坑的一个记录。
问题描述：因为使用chrome的密码自动填充会改变input框的样式，很丑，我搞不定选择绕路，不过我也试过挣扎一番（根据网上指引改了一下默认的样式，可能因为在uni-app中有点问题，没用），很丑。
怎么解决
绕路：不让浏览器帮我自动填充，我寄己搞，使用localStorage缓存登录成功的信息，an后对页面加载进行监听再取出本地缓存中的数据，因为我对input文本框的值做了双向绑定，所以实现起来也就很简单，此时的我认为非常完美。

so just do it

ok，模拟登录没问题，本地缓存也ok。
试一下模拟用户重新打开应用自动填充的效果？
模拟重新打开应用
理想中的完美运行在现实总是出点小插曲，你说程序为什么就不能顺一下我的意思呢，唉没办法debug咯。

行吧，那先看看代码

数据绑定部分

问题所在
嗯，咋一看没啥问题，为什么就不行了呢。
难道是this.password赋值出了问题？

此时发挥我200%的聪明才智---------问大佬

大佬告诉我把指向改一下试试，（let that = this ）然后

emmmmmmmmmmm，行了
在这里插入图片描述

本着我内心那强烈（为数不多）的探究欲望，稍微再思考一下下吧，经查证：

this
这里的 that 应该是指向当前vue实例的，而 this ？？这是个啥，那么也就很好解释了 this.password = res.data.password ; 根本没有对我的data模型数据进行修改,password和account 还是 “”，所以才导致先前的情况发生。由此我又想起了之前使用 axios 做异步请求时也发生过同样的事情，不长记性的锅。