props接管值的几种写法

props是只读的,不容许间接批改传进来的props的值,批改就会有正告

// 最简略的接管值的形式,接管的是一个数组props: [name,age]// 接管参数是一个对象props: {    name: String,    age: Number}// 最残缺的形式props: {    name: {        type: String,   // 数据的类型限度        required: true  // 数据是否必传    },    age: {        type: Number,        default: true   // 数据默认值    }}

Demo

// 父组件<template>  <div>    <Student name="景天" :age="20"></Student>    <Student name="雪见"></Student>  </div></template><script>import Student from './Student.vue'export default {  name: 'HelloWorld',  data () {    return {    }  },  components: {    Student  }}</script>// 子组件<template>    <div>      <h1>{{ msg }}</h1>      <div>姓名:{{name}}</div>      <div>年龄:{{age}}</div>    </div></template>3<script>export default {  name: 'Student',  data () {    return {      msg: 'Welcome'    }  },  props: {    name: {      type: String,      requried: true    },    age: {      type: Number,      default: 18    }  }}</script>