vue2里组件的一个属性，用来传递组件外部发来的数据
传递数据
<Student name="Bob" age=22/>
接收数据 -- 3种方法
// 1. receiving data only
// 组件里的props属性，和data/method同级
props:['name', 'age']
// 2. data type limited
props: {
name: String,
age: Number
}
// 3. more details added
props: {
name: {
type: String,
required: true,
default: "Alice"
}
}
修改传来数据
props是只读的，因此不接受任何形式的直接修改；如果需要修改，则需要将props内的数据拷贝到data中，然后针对data里的数据进行修改
? 创建一个按钮，点击事件是令组件的age值加1
<h1>Age: {{newAge}}</h1>
<button @click="ageUp">Click to Add Age Up</button>
? 在组件内部的属性里修改age值
// this指向的是这个组件实例Student
// 这个缩进怎么这么大
export default {
name: 'Student',
data() {
return {
newAge: this.age
}
},
methods {
updateAge() {
this.newAge++
}
}
}