props

propos是组件的自定义属性

在Count中：

props:['init'](在export default中，与data平级.)//init的名字是自定义的，一般叫init就行。

<MyCount init="8"></MyCount>

{{init}}

但是props里的值是只读的，程序员不能直接修改，否则终端会报错。

<button @click="init++">+1</button>    是错误d

<template>
<div>
  <button id="art">Mycount</button>
  <div>count的值是：{{count}}</div>
  <button @click="count++">+1</button>
  <button @click="show">打印this</button>
</div>
   <!--只有在add只有一行时才能使用-->
</template>

<script>

export default {
   props:['init'],
   data(){
    return{
      count:this.init
    }
  },
  methods:{
    show(){
      console.log(this)}
      
  }
}
</script>

<style>
#art{
  color:blue
}
</style>

props-default默认值

 当在<Mymount>中没有传递初始值

props:{
    //自定义属性A：{/*配置选项*}
    //自定义属性B：{/*配置选项*/ }
    init:{
      default:0
    }
   },

props-type

props:{
    //自定义属性A：{/*配置选项*}
    //自定义属性B：{/*配置选项*/ }
    init:{
      default:5,
      type:Number
      //Number必须大写，还可以是Array,Object,Boolean.
    }
   },

props-required，要求用户必须在实例化的时候声明init

props:{
    //自定义属性A：{/*配置选项*}
    //自定义属性B：{/*配置选项*/ }
    init:{
      default:5,
      type:Number,
      //Number必须大写，还可以是Array,Object,Boolean.
      required:true
      //校验是否填了init项
    }
   },