v-model实现
发布时间
阅读量:
阅读量
一、v-model的基础用法
该技术应用于input标签,该标签在功能上类似于子组件。
当触发button事件以修改父组件中的message值时,子组件中input框内的内容将随之发生变化;
而在子组件的input框内对输入值进行调整时,父组件中的message值同样会随之发生改变。
<template>
<div>
<button @click="changeInput">changeInput</button>
<input v-model="message" placeholder="edit me">
<p>Message is: {{ message }}</p>
</div>
</template>
<script>
export default{
data(){
return {
message: "plrease input..."
}
},
methods:{
changeInput() {
this.message = this.message + "1";
}
}
}
</script>
全部评论 (0)
还没有任何评论哟~
