Question

当我从服务器获取数据时，例如 [{methodName:mothodValue},{methodName:mothodValue}] 那么我想要动态生成方法，例如

methods: {
  functionArray.forEach(function (item) {
    item.functionName:function () {
      item.functionValue;
    }
  })
}

这是我的代码

var componentName = Vue.component(componentName, {
  data: function () {
    return {
      value: value
    }
  },
  template: componentTemplate,
  methods:{
    functionArray.forEach(function (item) {
      item.functionName:function () {
        item.functionValue;
      }
    })
  }
})

旧代码是

methods:{
  getValue : function(){
    getValue(this.value);
  }
}

有可能吗？

Answer 1

如果在创建Vue组件之前返回了来自服务器的数据（不确定在创建Vue组件之后是否可以添加方法），则可以创建一个方法对象，如下所示：

var methods = {};
functionArray.forEach(function (item) {
  methods[item.functionName] = item.functionValue;
});

您不能用代码填充对象文字，但是之后可以使用类似的代码填充空的对象文字。

然后您可以将其放入组件中，如下所示：

var componentName = Vue.component(componentName, {
  // ..
  methods: methods
});

如何向Vue组件动态添加方法

1 个答案: