使用Vue和Vuex时清除输入字段

Clearing input field when using Vue with Vuex

本文关键字:清除 输入 字段 Vuex Vue 使用      更新时间:2023-09-26

我想在我的vuex todo应用程序中添加一个新的todo后清除输入,我想知道这是否是应用程序状态,应该用vuex处理,或者组件状态,应该在组件本身内处理。现在我只有一个v-model连接到输入,它保存着一个空字符串:

<input v-model="text"...>

在我的组件内部:

data(){ return{ text: '' } } 下面是一个演示:http://codepen.io/p-adams/pen/YWBAqP

我遵循一个经验法则来确定什么时候需要处于应用程序级别状态,什么时候需要处于组件级别。

任何只影响组件的局部视图并且永远不会在视图外被需要的状态都可以是局部状态。如果您理想地选择了vuex,您也将避免这种情况。

其他所有内容都应该进入应用程序级别状态。然后在添加一些内容后清除输入只是在addTodo方法中设置this.text=""的问题。