What? Has anyone really been asked about the implementation principle of two-way data binding v-model during an interview? ? Isn’t this a question for giving points? ! !
The essence of v-model is actually a layer of packaging for value attributes and input events:
When the data changes, the page changes automatically, relying on v-bind:value
When the page input changes, the data changes automatically, relying on v-on:input
Sample code:
<template>
<div>
# v-model实现双向数据绑定
<input v-model="info" />
<h2>{
{ info }}</h2>
# value属性+input事件实现双向数据绑定
<input :value="msg" @input="msg = $event.target.value" />
<div>
</template>
<script>
export default {
data() {
return {
info: '',
msg: ''
}
}
}
</script>End------------------------------