如何在localStorage中存储数组？

我有一个数据属性

 data() {
    return {
        playWord: [],
        baseWord: "",
        result: [],

    }
},

并回应

   baseWord:"Amazing"

每次我在 api 中发送新请求时，基本词都会发生变化。 我想将每个数据存储在本地存储中并将字符串值发送到 axios post 方法。

我的发帖方法在这里

 methods: {
    name() {
        var name = localStorage.getItem("userName");
        console.log(name);
    },

    async playInfo() {
        this.$axios.post('user_play_info ', {
                words: "test",
                score: "5",
                user_name: localStorage.getItem('userName'),

            })
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });
    }
},

我一直在尝试 localstorage.setitem

 const testObject = this.baseWord
    console.log(testObject);

    localStorage.setItem('testObject', JSON.stringify(testObject));

    var retrievedObject = localStorage.getItem('testObject');

    console.log(retrievedObject);

如何将数据存储在数组中？并通过 api 响应发送字符串值。

这是一个关于如何在 Nuxt 中正确使用 API + 使用 localStorage 的完整示例

<template>
  <div>
    <button @click="cleanPlaylist">Clean the playlist</button>

    <p>Items</p>
    <ul v-for="user in users" :key="user.id">
      <li>
        <span>{{ user.name }}</span> ~
        <span>{{ user.email }}</span>
        <button @click="saveToLocalStorage(user)">Save this user</button>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      users: [],
    }
  },
  async fetch() {
    const response = await fetch('https://jsonplaceholder.typicode.com/users')
    const json = await response.json()
    console.log('json', json)
    this.users = json
  },
  methods: {
    saveToLocalStorage(user) {
      if (localStorage.getItem('playlist')?.length) {
        const currentUsers = JSON.parse(localStorage.getItem('playlist'))
        console.log('current users', currentUsers)
        const newData = [...currentUsers, user]
        localStorage.setItem('playlist', JSON.stringify(newData))
      } else {
        localStorage.setItem('playlist', JSON.stringify([user]))
      }
    },
    cleanPlaylist() {
      localStorage.removeItem('playlist')
    },
  },
}
</script>

代码沙箱可以是在这里找到 https://codesandbox.io/s/save-entity-to-localstorage-with-array-appending-r5b6z?file=/pages/index.vue.

你应该有大量的示例代码+有一些console.log了解正在发生的事情。当然，浏览器开发工具（Application选项卡）推荐。