props 属性

功能: 让组件接收外部传过来的数据

props属性优先级高于data

传递数据

<Demo name="xxx" age="yyy" />

接收数据

• 第一种方式: 只接收数据

props: ['name', 'age']

• 第二种方式: 接收并限制数据类型

props: {
  name: String,
  age: Number
}

• 第三种方式: 接收并限制数据类型、默认值、必要性

props: {
  name: {
    type: String,
    required: true // 必传
  },
  age: {
    type: Number,
    default: 99 // 默认值
  }
}

注意

• props是只读的, Vue底层会监测你对props的修改, 如果进行了修改会发出警告
• 若业务需求需要修改, 可以复制props的内容到data中, 然后去修改data中的数据