javascript - Vue.js 数据在 created() 函数中不可用

Question

我在使用 localStorage 中的数据初始化我的 Vue 组件时遇到问题。这是我的代码的简化版本

new Vue({
    el: "#my-element",
    created: () => {
        if (window.localStorage.getItem("verified")) {
            this.verification.verified = true;
        }
    },
    data: {
        verification: {
            verified: false
        }
    }
});

但我一直在控制台上收到错误 Cannot read property 'verification' of undefined

如果我在 created() 函数中放置一个 debugger，然后检查 this、this.verification 和 this.verification.verified，它们都设置为我在数据对象中初始化的值。

谁能解释一下我做错了什么？

基本上，如果用户之前已经完成了验证过程，我会尝试在页面加载时隐藏一个元素。

Answer 1

当您需要 this 的值时，可以使用箭头函数。在外部上下文中流入你的函数体，而不是函数有自己的 this 上下文.这意味着 this在你的created函数没有指向你的 Vue 实例。

但是您仍然可以使用 ES6 提供的简写方法声明语法:

new Vue({
    created() {
        // ...
    }
});