Question

我需要将在输入中输入的值保存到 vuex 中，然后在 vuex 中存储 localstorage ，然后如果应用程序已关闭，则在重新打开时，应将保存在localstorage中的值返回输入。现在由于某种原因，我的输入值未保存。请告诉我我在做什么错，或者如果可能的话，请更正代码。谢谢！

投诉人

<f7-list-input
  placeholder="Username"
  type="text"
  v-bind:value="name"
  @input="onPersist"
/>

export default {
mounted() {
  if (localStorage.name) {
    this.name = localStorage.getItem('name');
        }
    },

computed:{
    name(){
        return this.$store.state.name;
    }
},
methods:{
    onPersist(){
        this.$store.commit('persist',event.target.value);
    }
}
    };
    </script>

VUEX商店

export default new Vuex.Store({
    state: {
        name: ''
    },
    mutations: {
        persist(state,payload){
        state.name = payload; 
        localStorage.setItem('name', state.name);
       },
    }
});

Answer 1

您正在尝试设置没有任何设置器的计算属性的值。现在，没有为您的计算属性声明任何设置方法，代码的这一行

create view AllScores as 
select disctint  p.col1, p.col2,  ... 
  , a,col1, a.col2, ....
  , k.col1, k.col2, ....
  , f.col1, f.col2 ...
  , d.col1, d.col2  , ..... 
from players p
inner join topattacker  a on a.PL_ID = p.PL_ID 
inner join topdefenders  d on d.PL_ID = a.PL_ID 
inner join topkeepers on  k k.PL_ID = p.PL_ID 
inner join topmidfielders f  on f.PL_ID = p.PL_ID

不会引起任何反应性变化或改变vuex存储中的状态。您应该阅读有关form handling in vuex的更多信息，以更好地理解它。

要解决您的问题，只需要将挂载的钩子中的'persist'突变与从本地存储中提取的数据一起提交即可。

this.name = localStorage.getItem('name');

为什么输入中的值未加载vuex中的值？

1 个答案: