Question

我正在尝试将函数传递给recaptcha以用作回调。我需要写一下：

data-callback="function"

在Vue中如何添加功能参考？我试过了：

data-callback="{{ this.submitFocus }}"

data-callback="this.submitFocus"

我正在使用Vue 2

Answer 1

Recaptcha2使用data-callback字符串来调用全局可用的函数。

从我在documentation中看到的情况来看，看起来似乎没有一种编程方式来设置它，所以你可能不得不使用这样的东西

beforeMount () {
  window.submitFocus = () => { // using arrow function to preserve "this"
    this.submitFocus()
  }
},
beforeDestroy () {
  delete window.submitFocus
}

与

data-callback="submitFocus"

在你的模板中。属性值只需与添加到window的函数匹配。

Answer 2

data-callback是DOM元素的html属性，它只是一个字符串。它不知道对象实例的上下文，即。 this。

因此，在为ReCaptcha设置属性时，您无法使用this，它只会理解可以在没有this的情况下调用的函数。

如果您将函数定义为

function submitFocus(){ ... }

在全球范围内，您可以通过将data-callback设置为submitFocus而不引用this来让ReCaptcha调用它。

data-callback="submitFocus"

在Vue中通过数据属性传递函数引用

2 个答案: