我的问题是关于在 vue 实例上渲染一个按钮,单击一个按钮,然后通过事件单击渲染另一个按钮,如果我简单地安装按钮,它不会获得函数 tes。
const Hello = {
props: ['text'],
template: '<button v-on:click="tes"> </button> ',
};
new Vue({
el: '#app',
data: {
message: 'Click me'
},
methods:{
alertar: function(event){
const HelloCtor = Vue.extend(Hello);
var instance = new HelloCtor({
propsData: {
text: 'HI :)'
}
})
instance.$mount() // pass nothing
this.appendChild(instance.$el)
},
tes: function(){
alert('Teste');
}
}
})
错误:
vue.js:597 [Vue warn]: Invalid handler for event "click": got undefined
(found in <Root>)
warn @ vue.js:597
(index):52 Uncaught TypeError: this.appendChild is not a function
at Vue.alertar ((index):52)
at invoker (vue.js:2029)
at HTMLParagraphElement.fn._withTask.fn._withTas
最佳答案
问题是您在父 Vue
内部创建了一个子组件,其中包含绑定(bind)到 tes
函数的模板。这意味着子进程将在自己的方法中查找 tes,但它是父进程的属性,而不是子进程本身的属性,因此它永远无法在自己的作用域中找到它。您必须将该函数添加到子组件中:
const Hello = {
props: ['text'],
template: '<button v-on:click="tes"> </button> ',
methods: {
tes: function(){
alert('Teste');
}
}
};
关于javascript - Vue渲染按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50875369/