一、单向数据流
（1）：指只能从一个方向修改数据，即父组件可以向子组件传递数据，但是子组件不能直接修改父组件的状态
（2）Vue是单向数据流，Vue的双向绑定是语法糖
（3）：指在不影响功能的情况下，添加某种方法实现相同的效果，从而方便开发
（使用语法糖可以简化代码书写）
- 例如：v-bind绑定属性简写就是一个冒号
<p :id="id">123</p>
-
在使用的时候很像双向绑定的，但是 Vue 是单项数据流，v-model 只是语法糖而已
v-model的使用：
<input v-model="form" />
v-model的原理：
<input v-bind:value="form" v-on:input="form = $event.target.value" />
（4）因为Vue是单向数据流，子组件想修改父组件的值，需要使用$emit通知父组件，让父组件进行修改
二、计算属性computed的
&
1、getter&setter
计算属性computed默认只有getter，不过在需要的时候你也可以提供一个setter，有了setter属性后，就可以通过setter自主地改变计算属性本身的值
2、computed的一般写法
（因为默认只有getter，是默认值，所以也常常忽略不写）
data() {
return {
msg: 123
};
},
computed: {
newMsg() {
return this.msg * 2;
}
}
3、computed的完整写法
computed: {
newMsg: {
get() {
return this.msg * 2;
}
}
}
4、getter&setter的使用
- 其执行顺序是setter -> getter
<template>
<div id="demo">
<h3>msg：{{msg}}</h3>
<h3>newMsg: {{newMsg}}</h3>
<p>
输入框：
<input type="text" v-model="newMsg">
</p>
</div>
</template>
<script>
export default {
data() {
return {
msg: "你好"
};
},
computed: {
newMsg: {
getter：根据原有的属性计算出新的属性（获取数据）
get() {
return this.msg;
},
setter：当newMsg发生变化时（重新赋值），触发set方法，得到修改后的值通过value传入
set(value) {
this.msg = value; 当原有属性发生变化时，触发get方法，然后渲染到页面
}
}
}
};
</script>
