Vue（七）v-model 双向数据绑定

这里以组件的形式新建了一个test.vue，通过import导入，test.vue代码如下：

<template>
	<div id="testa">
		用户名：<input type="text" v-model="name" />
		<br />
		{
    
    {
    
    name}}
	</div>
</template>

<script>
	export default {
    
    
		name: 'test',
		data() {
    
    
			return {
    
    
				name: ''
			};
		}
	};
</script>

<style>
</style>

绑定name，注意在组件中“data”必须以函数的形式写出，{ {name}}即在name的实时值。name可以是任意形式的数据，也可以有初始值

效果：