<h5>1.绑定数据及事件:</h5>
<h2>
	<span v-bind:title="msg">
		title:{{name}}
	</span>
	<button v-on:click="resM">翻转</button>
</h2>
<pre>注意:v-on和v-bind的区别:v-on 指令添加一个事件监听器;v-bind 各类数据绑定指令</pre>
<script type="text/javascript">
	//绑定数据及事件
	const names = {
		data(){
return{
	name:'张三',
	msg:"我是title的提示信息"
}
		},
		mounted(){
this.name = "李四的家";
		},
		methods:{
resM(){
	this.name=this.name.split('').reverse().join('');
}
		}
	}
	Vue.createApp(names).mount('#app h2'); //声明式渲染方式——挂载事件
</script>

交互效果见:https://course.51qux.com/vue3-0-1