Question

是否可以通过将方法名称处理为其属性之一来触发Vue组件方法？

1Mb

我这样尝试过，但这给了我一个错误：

[Vue警告]：属性或方法“ goback”未在实例上定义，但在渲染期间被引用。通过初始化属性，确保在data选项中或对于基于类的组件，此属性都是反应性的。参见：https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties。

Answer 1

是的，这绝对有可能。

最简单的方法是传递纯字符串，例如

<navigation button-left="goback" />

请注意，没有v-bind。

然后在组件中，可以使用prop值。像...

export default {
  template: `<button @click="runButtonLeft">Go</button>`,
  props: ['buttonLeft'],
  methods: {
    runButtonLeft () {
      if (typeof this[this.buttonLeft] === 'function') {
        this[this.buttonLeft]()
      } else {
        console.error('Invalid method name:', this.buttonLeft)
      }
    },
    goback () {
      console.log('Run this.')
    }
  }
}

您没有指定应使用什么来触发方法执行，因此我已经提到了 click 事件。

通过属性触发Vue组件方法

1 个答案: