props使用

1.简单声明接受
   　　props:[‘name‘,‘age‘] 
        
        
2.接受的同时对数据进行限制
     props:{
          name:String,
          age:Number
        　　}
3.接受的同时对数据进行限制+默认值的指定+必要性的限制
   　props:{
          name:{
             type:String,
               required:true//是否必传
          　　},
          age:{
             type:Number,
            //required:default
             default:99
            }
        }

<template>
    <div class="student">
        <h1 v-text="msg"></h1>
        <h2>{{name}}</h2>
        <h2>{{myage+1}}</h2>
        <button @click="ageadd">年龄加1</button>
    </div>
</template>

<script>
    export default{
        name:‘Student‘,
        data() {
            return{
                msg:‘dadadadadad‘,
                myage:this.age
            }
        },
        methods:{
            ageadd(){
                this.myage ++
            }
        },
        props:{
            name:{
                type:String,
                required:true//是否必传
            },
            age:{
                type:Number,
                //required:default
                default:99
            }
        }
    }
</script>

<style>
</style>

<template>
    <div id="app">
        <Student name=‘大象‘ :age=60></Student>
        <hr >
        <Student name=‘王老二‘ :age=18></Student>
        <hr >
    </div>
</template>

<script>
    import Student from ‘./components/Student.vue‘
    export default{
        name:‘App‘,
        components:{
            Student
        }
    }
</script>

<style>

</style>