实现页面数据拼接的三种方法
- 插值语法实现:
...
<body>
<div id="root">
姓：<input type="text" v-model="SurName">
<br><br>
名：<input type="text" v-model="GivenName">
<br><br>
全名： <span>{{SurName}}-{{GivenName}}</span>
</div>
</body>
...
<script>
Vue.config.productionTip = false; //阻止 vue 在启动时生成生产提示
new Vue({
el: "#root",
data: {
SurName: 'She',
GivenName: "Jeacson",
},
...
});
</script>