javascript - 无法使变量与从 localStorage [Vuejs] 检索到的另一个变量相等

Question

我正在一个网站上工作，其中有一个对话框(来自 vuetify 库)绑定(bind)到一个名为“tutorial”的变量，该对话框内有一个用于关闭对话框的按钮和一个复选框，如果我在关闭之前检查 ckeckbox ，我将本地存储上的变量设置为“false”，并在创建的 lifehook 中尝试将对话框绑定(bind)到的变量与本地存储中的变量相等，但它不起作用。这里的组件:

<template>
  <v-containter>
    <v-dialog v-model="tutorial" max-width="500px">
        <v-card>
          <v-card-title>
            Tutorial
          </v-card-title>
          <v-card-text>
            Some tutorial text here
          </v-card-text>
          <v-card-actions>
           <v-btn color="error" @click="closeTutorial">Close</v-btn>
           <v-checkbox v-model="dontShowAgain" label="Don't show this again"></v-checkbox>
          </v-card-actions>
        </v-card>
      </v-dialog>
  </v-container>
</template>
<script>
const STORAGE_KEY = 'tutorial';

export default {
  data() {
    return {
      tutorial: true,
      dontShowAgain: false,
    }
  },
  created() {
    if (localStorage.getItem(STORAGE_KEY) === !null) {
      this.tutorial = localStorage.getItem(STORAGE_KEY);
    }
  },
  methods: {
    closeTutorial() {
      this.tutorial = false;
      if (this.dontShowAgain) {
        localStorage.setItem(STORAGE_KEY, this.tutorial)
      }
    }
  }
}
</script>

只要我在 localStorage 中看到，当我关闭选中复选框的对话框时，该值实际上已设置，但是当我尝试将组件中的变量与变量相等时，created() 方法没有任何反应在 localStorage 中，我做错了什么？

Answer 1

在 localStorage.setItem 通过 JSON.stringify() 将值转换为 json 之前尝试，当您从 localStorage 获取时，应用 JSON.parse() 以确保值的类型正确。