Javascript Vue.js-刷新时使用当前本地存储更新阵列

我想在重新加载页面时检查localStorage，如果已经有一个条目，如果是，我想用当前值（title&value）更新“cryptocurreny”

当我使用

addCrypto（）

函数添加内容时，我的本地存储如下所示：

[{“名称”：“ETH”，“值”：“1.5”}，{“名称”：“BTC”，“值”：“2.75”}]

这是我的组件：

<template>
  <div>

    <div v-for="coin in cryptocurrency">
      <input v-model="coin.name">
      <input v-model="coin.value">
    </div>
    <button @click="addCrypto">
      New Cryptocurreny
    </button>

  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      cryptocurrency: [],
    }
  },
  methods: {
    set_data() {
      localStorage.setItem( 'cryptocurrencies', JSON.stringify(this.cryptocurrency) );
      this.cryptocurrency = this.get_data();
    },
    get_data(){
      return localStorage.getItem('cryptocurrencies');
    },
    addCrypto() {
      localStorage.setItem( 'cryptocurrencies', JSON.stringify(this.cryptocurrency) );
      this.cryptocurrency.push({ name: '', value: ''});
    }
  }
}
</script>

新加密货币
导出默认值{
名称：“HelloWorld”，
数据（）{
返回{
加密货币：[]，
}
},
方法：{
set_data（）{
setItem（'cryptocurrences'，JSON.stringify（this.cryptocurrency））；
this.cryptocurrency=this.get_data（）；
},
获取_数据（）{
返回localStorage.getItem（'cryptocurrences'）；
},
addCrypto（）{
setItem（'cryptocurrences'，JSON.stringify（this.cryptocurrency））；
this.cryptocurrency.push（{name:''，value:''}）；
}
}
}

---

但是我尝试添加

localStorage.getItem（'cryptocurrences'）

在我的

addCrypto（）

函数的末尾，但是我得到了错误，在一个页面上重新加载我的

cryptocurreny

变量是空的。

我真的不知道你在做什么，但是从我看到的情况来看，

set\u data（）

函数没有在任何地方被调用

您需要使用已安装或创建的钩子（）并在那里进行签入

示例

mounted () {
  const saved = localStorage.getItem('cryptocurrencies')
  if (saved) {
    this.cryptocurrency = saved
  }
}

---

您可以将该代码放入它自己的方法中，并在

mounted（）

中调用它。当然。

我有一个简单的脚本，您可以按照这个脚本进行操作，如果您需要，它可以提供帮助