在微信小程序项目中 肯定会存在很多功能和样式上相似的部分 面对这种情况 只是单单的ctrl+c ctrl+v 就显得很low了，而且也不便于后期维护那么这时候 使用微信小程序中的自定义组件功能就很合适了.
那么该怎么使用自定义组件呢
首先 推荐建立一个专门放置组件模块的文件夹 component
建立一个test文件夹，里面放置你的组件代码文件（js json wxml wxss）其实就和新建一个page一样 在微信小程序官方开发工具中是有 新建Component 这个选项的
建立好之后，在test.josn文件中添加字段 component：true 这个字段表明这是一个组件，这个字段在新建的页面的json文件中是没有的，官方默认它为false，也就是非组件
然后你就可以像编写页面一样编写组件逻辑代码，以及样式和页面开发是完全一样的 说到这里爱思考的同学可能会有这样的想法，如果我在组件中某些元素定义的class名和页面中的元素class名一样的话，会不会出现覆盖的情况，
注意在组件wxss中不应使用ID选择器、属性选择器和标签名选择器，否则会覆盖至使用组件，的页面的样式 尽量使用class 除非你能够清晰的清除他们的关系
定义组件完成之后下面就可以使用了 使用的方法打开要使用组件test的page下的json文件
添加usingComponents:{},这个字段表明，此page使用的组件有哪些，其中键：值关系为{表明你要为使用的组件定义的name：组件文件的路径（一定要指定到文件那一级）}
至此组件的定义及使用就结束了，但是，假设当前page需要将某个值传递至组件内，又该如何怎
么办呢
打开组件test的js文件
在使用组件的page上添加组件标签
可以看到这里有个属性properties 这个类似于vue中的props，你可以再次定义字段 然后在组件标签上像html标签自定义属性一样为其赋值
查看更多关于【小程序文章/教程】的文章
小程序 AI/AR 能力
一、关于 VisionKit1、定义VisionKit 为小程序提供了开发 AR 功能的能力，包含了 AR 在内的视觉算法。2、版本提供了 V1 和 V2 两个版本，区别如下：V1平面接口，适用于用户在平面场景下，例如桌面，地面，泛平面场景，放置虚拟物体，不提供真实世界距离。用户
0评论2023-03-08842
Python小程序——快排算法 快排 python
1 def Partition(list,p,q): 2 #这里是用来分块的算法。 3 x = list[p] 4 i = p 5 for j in range(p+1,q+1): #注意range是顾前不顾后的，所以后面的区间值要大一位 6 if list[j]x: 7 i+=1 8 list[i],list[j] = list[j],list[i] 9 10 list[p], list[i] = list[
0评论2023-02-09351
c++第一个小程序 第一个小程序是什么
#include iostreamusing namespace std;int main(){const int SIZE=50;//定义大小。char name[SIZE]; cout"please input you name!\n"; //提示cinname;//输入cout"hello world:"nameendl; //输出return 0;} #include iostreamusing namespace std;int m
0评论2023-02-09579
微信小程序 错误记录
1、报错this.getUserInfo(this.setData) is not a function;at pages/index/index onShow function;at api request success callback functionTypeError: this.getUserInfo is not a function在回调结果里调用这个页面的函数 this.fun() 或者 this.setData 时
0评论2023-02-09477
【小程序】添加tabBar后navigateTo失效
某页面.js//事件处理函数bindViewTap() {wx.navigateTo({url: '../logs/logs',})}, app.json"tabBar": {"backgroundColor": "black","color":"white","list": [{"pagePath": "pages/index/inde
0评论2023-02-09474
小程序组件之间的通信 小程序子父子组件通信
前言：其实之前就想写这个的，因为我觉得这么模块化的框架，组件之间通信是非常重要的，也是最经常用到的一块儿，只是之前在项目里一直没用到跨组件通信，现在用到了，也会用了，就一起写出来得了 :） 一、父、子组件之间的通信注：首先我们先将子组件在父组
0评论2023-02-09452
微信小程序左右滑动切换页面示例代码--转载
微信小程序——左右滑动切换页面事件微信小程序的左右滑动触屏事件，主要有三个事件：touchstart，touchmove，touchend。这三个事件最重要的属性是pageX和pageY，表示X，Y坐标。touchstart在触摸开始时触发事件;touchend在触摸结束时触发事件;touchmove触摸的
0评论2023-02-09564
让vue用于小程序setData方法
setData:function(obj){let that = this;let keys = [];let val,data;Object.keys(obj).forEach(function(key){keys = key.split('.');val = obj[key];data = that.$data;keys.forEach(function(key2,index){if(index+1 == keys.length){that.$set(data,key2,
0评论2023-02-09891
微信小程序 canvas导出图片模糊
//保存到手机相册save:function () {wx.canvasToTempFilePath({x: 0,y: 0,width: 375, //导出图片的宽height: 680, //导出图片的高destWidth: 375 * 750 / wx.getSystemInfoSync().windowWidth, //绘制canvas的时候用的是px， 这里换算成rpx ，导出后非常清晰
0评论2023-02-09339
微信小程序hidden问题 微信小程序隐藏view
context.fillText('Hello World', 20, 380); wx.drawCanvas({ canvasId: '2', actions: context.getActions() });
0评论2023-02-09905
小程序***滑动的表格 小程序实现左右滑动
// pages/test/test.jsPage({/** * 页面的初始数据 */data: {headerList: [{name: '表头一',number: 'A201',type: "标准间"}, {name: '表头二',number: 'A202',type: "大床"}, {name: '表头三',number: 'A203',t
0评论2023-02-09530
微信小程序实现图片双滑缩放大小 微信小程序图片点击放大
在做小程序开发的过程中，后端传来一张图片地图，需要实现双手指滑动，使图片缩放，最终得出了一下代码： js ：Page({data: {touch: {distance: 0,scale: 1,baseWidth: null,baseHeight: null,scaleWidth: null,scaleHeight: null}},touchStartHandle(e) {/
0评论2023-02-09697
