与getter和setter结合使用本地计算函数的Vuex语法错误

Question

将Vuex本地计算对象与get/set以及存储映射组合在一起时出现语法错误.

如Vuex文档中所示,您可以使用对象扩展操作符来映射这样的存储方法,如:

computed: {
  localComputed () { /* ... */ },
  // mix this into the outer object with the object spread operator
  ...mapState({
    // ...
  })
}

https://vuex.vuejs.org/en/state.html##object-spread-operator

您还可以创建计算设置器,如:

computed: {
  fullName: {
    // getter
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    // setter
    set: function (newValue) {
      var names = newValue.split(' ')
      this.firstName = names[0]
      this.lastName = names[names.length - 1]
    }
  }
}

https://vuejs.org/v2/guide/computed.html#Computed-Setter

我可以使用get set创建一个计算对象,或者使用mapState/mapGetters等创建 - 但不能组合使用.它打破了语法(错误是:函数声明后的预期函数名).

    computed: {
        localComputed () {
            localMethod: {
                get: function () {
                        // retrieve
                },
                set: function (newContent) {
                    // set
                }
            }
        }, ...mapState([

                       ]), ...mapGetters([])

    }

我如何结合这两个？

Answer 1

您正在试图确定localMethod内localComputed.

在文档中,localComputed只是组件中计算属性的示例名称.您不必将所有其他本地计算属性放在其中.

因此,您应该能够执行以下操作:

computed: {

  localComputed: {
    get: function () {
      // retrieve
    },
    set: function (newContent) {
      // set
    }
  },

  anotherLocalComputed: {
    get: function () {
      // retrieve
    },
    set: function (newContent) {
      // set
    }
  },

  ...mapState([]),

  ...mapGetters([])

}