Data --> View --> Data2 --> View2
<!--
* @Author: your name
* @Date: 2020-03-30 21:33:46
* @LastEditTime: 2020-03-30 21:54:16
* @LastEditors: Please set LastEditors
* @Description: Vue的雙向數據綁定
* @FilePath: \x\03.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script type="text/javascript" src="./node_modules/vue/dist/vue.js"></script>
<div id="app">
<!-- <input type="text" v-model="msg"> -->
<input type="text" v-bind:value="msg" v-on:input='valueChange'>
<h3>{{msg}}</h3>
</div>
<script type="text/javascript">
new Vue({
el: "#app",
data() {
return {
msg: "da"
}
},
methods: {
valueChange(e) {
console.log(e)
this.msg=e.target.value;
}
},
});
</script>
</body>
</html>
![在這裏插入圖片描述]()
