Uni-App - 自定义组件 - 自定义组件创建及使用

Posted 2021-03-09 恒捷

创建自定义组件

1、新建 组件.vue 文件
2、组件文档结构
<template name="组件名称">
    <view>
        ......
    </view>
</template>
<script>
export default {
    name: "组件名称",
    //属性
    props: {
        属性名称: {
            type: String,//属性类型
            value: "值"
        },
        ......
    },
    //组件生命周期
    created:function(e){
    
    },
    methods: {
        函数名称:function(obj){
        
        },
    }
}
</script>
<style>
组件样式
</style>

?

使用组件

1、引用组件
import 组件名称 from "../../components/组件名.vue";
2、注册组件
export default{
    components:{
        组件名称
    },
}
3、在试图模板中使用组件
<组件名称 组件属性="对应的值"></组件名称>