VUE注册局部组件

    // 局部组件命名规范
    /*
      1文件夹名大驼峰 MyLocalBtn.vue
      2 使用的时候 将驼峰转化为横杠 <my-local-btn></my-local-btn>

    */ 

 

MyLocalBtn.vue局部组件

<template>
    <div>
        <div>我输局部组件---{{valuea}}</div>
    </div>
</template>

<script>
    export default {
        name:"my-local-btn",
        data(){
            return{

            }
        },
        props:["valuea"]

    }

</script>

 

在某个组件中使用局部组件

<template>
    <div>
        <!-- 使用局部组件 -->
        <my-local-btn valuea="新增数据"></my-local-btn>
    </div>
</template>

<script>
import MyLocalBtn from   "../../components/cuscom/MyLocalBtn";  //引入局部组件
    export default {
        data(){
            return{

            }
        },
        components: {
            'my-local-btn': MyLocalBtn  //引入局部组件 通过components组件
        },

    }
</script>