vue组件使用的使用
  1. 创建 在vite项目的components文件夹下创建组件，以.vue 结尾

  2. 在app.vue 组件中使用：

    1. 引入 importDbuttonfrom'./components/Dbutton.vue'

    2. 注册 

      1. components:{
      2. Dbutton
      3. }

    3. 在template模板中使用

      1. <template>
      2. <Dbutton content="内容" />
      3. </template>

      vue组件传参之props传参

      props用于父组件给子组件传参

  3. 给子组件上添加要传递的属性 ，比如传递一个名称为content的属性

    1. <Dbutton content="内容" />

  4. 子组件通过和data平级的props接收,props可以是数组或对象，先学最简单的数组。数组中的content和父组件的保持一致

    1.  export default {
    2.      props:['content'],
    3.      data(){
    4.          return {
    5.          }
    6.      },
    7.  }

  5. 在子组件的模板上使用，和使用data中的对象一样的用法

    1. <template>
    2.  <div>
    3.      {{content}}
    4.  </div>
    5. </template>

    vue通过props传参之对象形式

    之前我们说子组件通过props接收父组件的参数，可以是数组或者对象形式。
    对象形式可以设置校验参数类型，默认值等，更为规范和严谨。写法如下

    1.      props:{
    2.          content:{
    3.              type:String, 
    4.              default:'缺省内容'
    5.          }
    6.      },

    type可以是string，number，array，function等数据类型
    注意：default可以写成函数形式，当type的值是引用类型的时候，default默认值必须是函数形式

    1. props:{
    2.  content:{
    3.      type:String, 
    4.      default(){
    5.          return '缺省内容'
    6.      }
    7.  }
    8. },