与 Page
类似,自定义组件也由 axml
、js
、json
、acss
4 个部分组成。创建自定义组件有以下 2 个步骤:
- 声明一个组件。
- 使用
Component
函数,注册自定义组件。
以下为一个基本的组件示例:
// app.json
{
"component": true
}
// /components/customer/index.js
Component({
mixins: [], // minxin 方便复用代码
data: { x: 1 }, // 组件内部数据
props: { y: 1 }, // 可给外部传入的属性添加默认值
didMount(){}, // 生命周期函数
didUpdate(){},
didUnmount(){},
methods: { // 自定义方法
handleTap() {
this.setData({ x: this.data.x + 1}); // 可使用 setData 改变内部属性
},
},
})
<!-- /components/customer/index.axml -->
<view>
<view>x: {{x}}</view>
<button onTap="handleTap">plusOne</button>
<slot>
<view>default slot & default value</view>
</slot>
</view>
文档内容是否对您有帮助?