这里探索一下v-model双向数据绑定的原理。

html部分：

<input type="text"  v-model="title"/>
<h4 v-bind="title">绑定title</h4>
<input type="text" v-model="content"/>
<h4 v-bind="content">绑定content</h4>

js部分：

//双向数据绑定
		function Vue(){
			let proxy=new Proxy(
			{},
			{
				get(obj,property){},
				set(obj,property,value){
					obj[property]=value;
					document.querySelectorAll(
					`[v-model="${property}"],[v-bind="${property}"]`
					).forEach(el=>{
						el.innerHTML=value;
						el.value=value;
					});
				}
				
			});
			//初始化绑定元素事件
			this.run=function(){
				const els =document.querySelectorAll("[v-model]");
				els.forEach(item => {
				      item.addEventListener("keyup", function() {
				        proxy[this.getAttribute("v-model")] = this.value;
				      });
				});
			};
		}
		let vue=new Vue().run();