vue3 v-model
时间: 2023-11-07 19:04:14 浏览: 106
在Vue 3中,v-model指令的用法有所改变。在Vue 3中,v-model的实现方式变成了基于组合API的模式。以下是使用Vue 3中v-model的方法:
首先,我们需要导入`ref`函数:
```javascript
import { ref } from 'vue';
```
然后,在组件的`setup`函数中创建一个响应式变量:
```javascript
setup() {
const inputValue = ref('');
return {
inputValue
};
}
```
接下来,在模板中使用`v-model`指令:
```html
<input v-model="inputValue" />
```
这样,`inputValue`变量就会和输入框的值进行双向绑定了。你可以通过修改`inputValue`的值来更新输入框的值,并且输入框的值改变时也会自动更新`inputValue`的值。
阅读全文