Очистить поля ввода vue после испускания события
У меня есть компонент Vue с входом и кнопкой. Я хотел бы, чтобы кнопка отправила вход в другое место, а затем очистила вход. Последняя часть, не происходит.
Вот грубая работоспособная версия того, что у меня есть:
new Vue({
el: '#root',
template: `
<div>
<input type='text' v-model='name'/>
<button @click='onClickMe'>Click me</button>
</div>
`,
methods: {
onClickMe () {
this.$emit('set-this-elsewhere', { name: this.name })
this.name = ''
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="root">
</div>У вопроса есть решение - Посмотреть?
Ответы - Очистить поля ввода vue после испускания события / Clear vue input fields after emitting event
Является ответом!
28.10.2020 02:44:31
Вы видите ошибку в консоли?
Свойство или метод "name" не определяется в экземпляре, но на него ссылаются во время рендеринга
Вам нужно добавить
data() {
return {
name:''
};
},
new Vue({
el: '#root',
template: `
<div>
<input type='text' v-model='name'/>
<button @click='onClickMe'>Click me</button>
</div>
`,
data() {
return {
name: ''
};
},
methods: {
onClickMe() {
this.$emit('set-this-elsewhere', {
name: this.name
})
this.name = ''
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="root">
</div>
Помочь в развитии проекта: