// 局部组件命名规范 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:{
valueaa:{
type:Number | String, //类型 字符串或者是数组
required:true,//这个参数必须传递 否者会警告
default:40,
// 自定义校验器
validator:(value)=>{
return value > 10
}
}
}
}
</script>
在某个组件中使用局部组件
<template> <div> <!-- 使用局部组件 --> <my-local-btn valuea="新增数据"></my-local-btn> </div> </template> <script> import MyLocalBtn from "../../components/cuscom/MyLocalBtn"; //引入局部组件 export { data(){ : MyLocalBtn //引入局部组件 通过components组件 },} </script>