1.写这篇博客的原因
原因很简单,微信官方文档写的不是很清楚。腾讯只是介绍了一些组件的特性怎么使用。
附上小程序自定义控件教程的官方地址:
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/custom-component/
2.最后的结果
3.具体的操作步骤
3.1 创建一个自定义组件customComponent
3.2 在customComponent.json文件里面配置一下
{
"component": true, // 组件的声明
"usingComponents": {} // 使用别的组件
}
腾讯默认情况下生成的组件配置文件,就是这个。如果没有使用别的组件,不用改就行了。注意,我是为了便于理解加了注释。直接这样加会报错。实际运行的时候,去掉即可。
3.3 在自定义组件中编写自己的代码
为了简单,我就改变一下customComponent.wxml文件。
<!--pages/customComponent/customComponent.wxml-->
<text>我是自定义组件,我就想试试</text>
3.4 在其他组件中,使用自定义组件
3.4.1 声明要使用自定义组件
我就在index组件中,使用这个自定义组件。
因为小程序的index组件中默认没有index.json文件,那就新建一个index.json文件。然后添加代码。
{
"usingComponents": {
"customComponentaaa": "/pages/customComponent/customComponent"
}
}
然后,我们自定义的组件标签customComponentaaa,就可以当做一个组件使用了。这里customComponent后面加aaa,是为了便于区分。
3.4.2 使用自定义组件
<!--index.wxml-->
<customComponentaaa></customComponentaaa>
运行一下之后,就会呈现出结果:
4.结束语
下一次写一个项目实战中能用到的对话框。