Javascript 如何通过Vue模板中的单击事件传递Vue组件？

我被一个通过的Vue组件卡住了

调用Vue组件中的单击事件时，我希望将Vue组件传递给其他组件。 我尝试了“this”，但它返回空值

如果有人能帮我。 这是我的密码。提前谢谢

<template>
...

<button type="button" class="confirmBtn" @click="$util.routerReplace(this, '/')">
    <span>confirm</span>
</button>
...

</template>

util.js
function routerReplace (foo, path) {
    console.log(foo)        // Now return null => Vue Component
    console.log(path)       // path
}

...
确认
...
util.js
函数routerReplace（foo，path）{
console.log（foo）//现在返回null=>Vue组件
console.log（path）//path
}

我的理解是，直接在模板中指定的事件处理程序中的所有标识符都使用

this

作为上下文进行计算。因此，您正在将

this.this

传递到未定义的

routerReplace

如果改用组件方法作为事件处理程序，则该方法有效：

var组件={
模板：“确认”，
方法：{
onClick:function（）{
this.$util.routerReplace（this，“/”）
},
},
}
prototype.$util={}；
Vue.prototype.$util.routerReplace=函数（组件，路径）{
日志（组件、路径）；
};
新Vue({
el:“#应用程序”，
组成部分：{
MyComponent：组件，
},
})