微信小程序的自定义组件的实现方法
更新时间：2024年05月16日 10:18:58 投稿：mrr
这篇文章主要介绍了微信小程序的自定义组件的实现方法,把页面重复的代码部分封装成为一个自定义组件,以便在不同的页面中重复使用,有助于代码的维护,感兴趣的朋友跟随小编一起看看吧
一、创建自定义组件
（1）定义：
把页面重复的代码部分封装成为一个自定义组件，以便在不同的页面中重复使用，有助于代码的维护。
（2）组成：
自定义组件的组成：json文件，js文件，wxml文件，wxss文件
（也就是配置，逻辑，结构，样式）
（3）使用：
在components文件夹下新建一个文件夹，命名为test。test文件夹下新建component。然后自定义命名为test敲回车
（4）此时，test.js里面会出现如下属性。
data属性，可读可写，更倾向于储存组件的私有数据
properties属性，可读可写，更倾向于存储外界传递的公有数据
（5）在test.wxml里面写好自定义组件封装的内容：
<view>我是自定义组件test</view>
二、使用自定义组件
（1）使用前提：
在页面的json文件或app.json里修改全局配置
自定义组件的引用方式：
局部引用：在页面的json文件中引用自定义组件
全局引用：在app.json全局配置文件中引用自定义组件
（2）使用：
在app.json里面：
然后直接在pages下的index.wxml引用自定义组件test
（3）效果如图所示：
到此这篇关于微信小程序的自定义组件的文章就介绍到这了,更多相关微信小程序自定义组件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
今天小编就为大家分享一篇layui获取多选框中的值方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
这篇文章主要介绍了JS正则匹配中文的方法,结合具体实例形式分析了JS针对中文的匹配操作相关技巧与注意事项,需要的朋友可以参考下2017-01-01
Javascript异步表单提交，图片上传，兼容异步模拟ajax技术
使用Javascript异步表单提交，图片上传，兼容异步模拟ajax技术,需要的朋友可以参考下。2010-05-05
在开发过程中,可能会遇到需要将一维数组转换为多维数组的情况,以满足特定数据结构的需求,文章介绍了如何将后端返回的一维列表数据通过编程方法转换成三维数组结构,以适应特定的UI展示需求,通过循环遍历和数据重组的方式,可以有效地实现数组结构的转换2024-09-09
这篇文章主要介绍了详解如何在微信小程序中愉快地使用sass，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-07-07
JavaScript中如何通过arguments对象实现对象的重载
js 中不存在函数的重载，但却可以通过arguments对象实现对象的重载，下面有个不错的示例，大家可以参考下2014-05-05
Bootstrap每天必学之表单，本文讲解的就是大家最为常用的提交数据的Form表单，感兴趣的小伙伴们可以参考一下2015-11-11
这篇文章主要介绍了微信小程序常用赋值方法,结合实例形式总结了微信小程序局部变量、全局变量及data对象属性赋值相关操作技巧,需要的朋友可以参考下2019-04-04
下面小编就为大家带来一篇JS函数修改html的元素内容,及修改属性内容的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-10-10
layui type2 通过url给iframe子页面传值的例子
今天小编就为大家分享一篇layui type2 通过url给iframe子页面传值的例子，具有的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
最新评论