Vue中的props详解

最基础和最常用的用法：

子组件中：

 App.vue主组件中：

  const player1 = reactive({
    name: "梅西",
    img: "/images/flowers.png",
    rate: 1,
    hot: 433760
  })
  const player2 = reactive({
    name: "梅西",
    img: "/images/flowers.png",
    rate: 1,
    hot: 433760
  })
  const team1 = reactive({
    name: "法国队",
    img: "/images/flowers.png",
    rate: 1,
    hot: 451511
  })

 用法简单易懂！

高级用法：

 

 

对于第一个和第二个 即count和obj 我们直接设置Number 和 Object 用处不大，只是做一个简单的校验，不会报错，但是会警告；而对于第三个maxLength 我们是通过一个对象来校验数据的合法性！！这样的话就会有严格性的数据校验了！！对于是通过函数判断是否合法的 就看返回值的bool类型了 

其实这些高级的用法都只是进行数据合法性检验而已

然后 一般在开发过程中才会常用这个数据合法性检验  上线后一般会常用的可能就是其中的default 设置默认值的功能了

 

 除了boolean类型的所有的未传递的可选的prop的值都会被写成undifined

如下：如果写了一个boolean类型的变量  那么默认值为false 如果要改的话  可以写default为undifined