基于vuex状态如何模糊或聚焦vuejs组件

时间:2018-10-21 01:17:51

标签: vue.js vuejs2 vuex

vuejs有点问题。

我的状态基本上是这样的。

  state: ()=>({
        activeSide : "from",
    }),

我希望根据activeSide是否将activeSide值设置为“ from”来使组件聚焦或模糊

此刻我的想法似乎并不十分优雅,我基本上在组件中创建了一个计算属性,

focusSide(){
    console.log("changed active side")
    this.$store.state.activeSide
}

然后我设置了一个手表,以查看该属性是否更改。

watch:{
focusSide : function(newV,_){
  console.log("changing focus")
  newV=="from" ? this.$refs.fromArea.$el.focus() : this.$refs.fromArea.blur()
}

},

这里的问题是,除了解决方案看起来不美观之外,手表也不起作用,我已经看到focusSide正确地更改了其值(或者至少执行了该方法的主体) ),但没有执行观察程序,我有一种感觉,因为在我的模板中从未使用过focusSide状态,所以vuejs认为没有必要做出反应和更改值,就像反应式框架一样,如果不遵守该值,则不要这样做。改变(也许我错了)

什么是实现此目标的理想方式??? 谢谢

1 个答案:

答案 0 :(得分:2)

您需要计算属性focusSide的返回值,否则它将始终返回未定义

focusSide () {
    console.log("changed active side")
    return this.$store.state.activeSide
}