Question

我拥有在localStorage，enableLog = false中设置的属性。如果我在控制台localStorage.enableLog = true中编写，如何在vuex存储中读取该值并将状态从false翻转到true并触发console.log？

我要执行的操作是添加临时控制台日志记录。例如，我们有一个应用程序，它将数据发送到另一个应用程序，该应用程序在弹出窗口中启动。在弹出式应用程序中，如果另一个开发者将enableLog从false更改为true，他/她将能够看到有效载荷中的初始数据通过console.logs的功能。我的应用程序如何读取localStorage属性，然后如何从中更新状态，最后重新渲染以触发该函数调用console.log的位置？

index.js，状态：

isLoggingData: false

index.js，操作：

async init ({ state, commit, dispatch }) {
    try {
      const { data } = await messaging.send(ACTION.READY)
      commit(types.SET_LOGGING_DATA, data) // capture this initial data to be used later

index.js突变：

  [types.SET_LOGGING_DATA] (state, isLoggingData) {
    state.loggedData.initData = isLoggingData
  },

App.vue：

async created () {
    localStorage.setItem('isLoggingData', this.isLoggingData)
    await this.onCreated()

async onCreated () {
      await this.init()

我不知道如何听localStorage.isLoggingData中的更改。

Answer 1

vuex-shared-mutations应该符合您的需求。

Share vuex mutations across tabs via `localStorage`.

如何从Vue商店中的localStorage中读取数据并进行突变状态

1 个答案: