2.vue的数据与方法
<body>
<div id="app">
{{message}}
</div>
<script>
let method={message:'hello~lobster'};
let app = new Vue({
el:'#app',
data:method //结果是hello~lobster
/*
这里的method指的是前面我写好的method方法，也可以写成data:{
message: 'hello~lobster'
}
*/
})
method.message='hello', //这时message的内容将会被更改成hello
app.message='hi' //这时message的内容将会是被改成hi
//app.message==method.message
</script>
</body>
<body>
<div id="app">
{{message}}
</div>
<script>
let method={message:'hello~lobster'};
let app = new Vue({
el:'#app',
data:method //结果是hello~lobster
/*
这里的method指的是前面我写好的method方法，也可以写成data:{
message: 'hello~lobster'
}
*/
})
//$watch方法要写在初始赋值与更改值之间！即现在这个位置
app.$watch('message',function (newVal,oldVal) {//newVal指的是message新的值,oldVal旧的值
console.log(newVal,oldVal) //控制台输出的结果是hello hello~lobster（刚好newVal,oldVal的位置对应上了)
})
method.message='hello' //这时message的内容将会被更改成hello
</script>
</body>