【Vue2.0学习】—props配置（五十四）

【Vue2.0学习】—props配置（五十四）

<template>
  <div>
    <h2>{{msg}}</h2>
    <h2>姓名：{{name}}</h2>
    <h2>年龄：{{age}}</h2>
    <h2>性别：{{sex}}</h2>
   
  </div>
</template>

<script>
export default {
    name:'SchoolBei',
    data(){
        
        return{
        
            msg:'我是一个爱学习的好孩子'
        }
    },
    //方式一：简单接收
 //   props:['name', 'age', 'sex']

  //方式二、接收的同时对数据进行限制
//  props:{
//     name:String,
//     age:Number,
//     sex:String
//  }

// 方式三、接收的同时对数据进行限制+默认值的指定+必要性的限制
props:{
    name:{
        type:String,//name的类型是必须的
        required:true// name是必要的
    },age:{
        type:Number,
        default:99
    },
    sex:{
        type:String,
        required:true
    }
}
}
</script>

<style>

</style>