Vue中的配置项props

目录

Vue中的配置项props

传递数据

不使用配置项props

第一种方式（只接收）

第二种方式（限制类型）

第三种方式（限制类型、限制必要性、指定默认值）

如何修改呢？

总结 

---

Vue中的配置项props

传递数据

App.vue中代码如下

<template>
  <div>
    <MyStudent name="李四" sex="女" :age="20"/>
  </div>
</template>

<script>
  //引入MyStudent组件
  import MyStudent from './components/MyStudent.vue';
  export default {
    name:'App',
    components: { MyStudent }
  }
</script>

 接收数据：子组件MyStudent.vue中

<template>
  <div>
    <h1>我是一个学生</h1>
    <h2>学生姓名：{
  {name}}</h2>
    <h2>性别：{
  {sex}}</h2>
    <h2>年龄：{
  {age}}</h2>
  </div>
</template>