<body>
  <input type="text" v-model="title" />
  <input type="text" v-model="title" />
  <div v-bind="title"></div>
</body>
function View() {
	// 设置代理拦截
	const 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
			})
		})
	}
}

const view = new View()

view.run()
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.