- 博客(48)
- 收藏
- 关注
原创 微信小程序-自定义导航栏
1.JSON文件中配置"navigationStyle": “custom”3.设置图片样式宽度百分百显示。2.给导航栏设置轮播图。
2024-11-05 22:29:13
447
原创 微信小程序-事件总线
事件总线是对发布-订阅模式的一种实现,是一种集中式事件处理机制,允许不同组件之间进行彼此通信,常用于两个非父子组件和兄弟组件之间的通讯。在日常开发过程中,我们可以使用第三方的发布订阅 JS 包来实现事件总线的功能。
2024-11-05 22:23:51
674
1
原创 微信小程序-转发/分享/手机号验证/客服
1.页面JS文件必须声明onShareAppMessage监听函数2.button组建的open-type值设置为share。
2024-10-28 22:32:20
586
原创 微信小程序-获取头像和昵称
1.将button组件open-type的值设置为chooseAvatar2.通过bindchooseavatar事件回调获取到头像信息的临时路径。
2024-10-23 22:21:34
1523
原创 微信小程序-独立分包/分包预下载
独立分包不依赖主包运行。在subPackages添加Independent字段,声明独立分包独立分包不能使用主包和其它包资源。
2024-10-15 21:20:56
649
原创 微信小程序-分包加载
小程序是由多个页面构成,为了因为代码量多,体积大导致用户打开速度变慢,小程序提供了分包加载数据。分包加载数据,只有在主包调用分包某一个页面时候才会调用加载分包。即就是按需加载。整个小程序不能超过20M,单个分包不可以超过2M。
2024-10-11 21:58:31
487
原创 微信小程序-下载NPM管理第三方依赖
1.先从官网进行下载网站为Node.js (2.下载到习惯的路径下比如:C:\Program Files\nodejs3.配置环境变量如果不配置好就会导致微信小程序里面找不到路径的情况,打开控制面板->系统与安全->系统->高级系统设置->环境变量用户环境变量:系统环境变量。
2024-08-01 23:38:50
1403
原创 微信小程序-外部样式类
在使用组件的时候,组件使用者可以传入组件的类名,通过组件的类名来修改组件的样式。步骤:1.使用externalClasses定义传入的类名2.属性值是externalClasses定义的类名3.将externalClasses的类名传入自定义组件。
2024-07-31 22:56:17
836
原创 微信小程序-代码复用方法Behavior
behavior方法里面可以存放properties,data,methods,lifetimes等需要组件复用的属性和方法。在定义好复用的属性和函数后,需要将复用的代码暴露出去。通过const behavior = Behavior({})接收方法对象然后通过如下代码进行暴露。
2024-07-25 23:01:42
507
原创 微信小程序-使用Component方法代替Page方法构造页面
在小程序js文件里使用Component方法代替Page方法需要在json文件里面定义usingComponents属性二.注意事项1.在page页面里使用的钩子函数和事件监听方法都需要卸载methods对象里面2.接收页面参数2.1 通过onLoad(options)里面的options里面有接收的参数值传参页面代码接收参数页面代码
2024-07-24 23:18:37
1161
原创 微信小程序-自定义组件生命周期
组件实例创建完毕调用。定义在lifetimes对象里。不能在方法里面更改data对象里面的值,但是可以定义属性值。
2024-07-19 22:49:05
949
原创 微信小程序-组件通信
以checkbox为例子,自定义一个checkbox组件,定义properties属性的checked值,当父组件checked值为true,则默认勾选。父组件代码父组件将值传递到properties的checked属性,此时需要在JS中将checked的值赋给data中定义的isCheck才会使checkbox默认勾选。
2024-07-16 22:58:21
414
原创 微信小程序-自定义组件数据监听器observers
自定义组建的属性值在被使用组件里面传值的时候就会被监测到。这就导致在编译期间就会检测到自定义组件的properties值定义propertieslabel:{value:''监测//key监听的数据 value最新的数据//data的数据发生改变就会被检测到//监听属性值。
2024-07-04 23:24:27
1699
原创 微信小程序-组件样式隔离
isolated是自定义组件.js的options对象字段styleIsolation的默认值,表示自定义组件和组件使用者之间的样式相互独立,互不影响。
2024-07-03 23:23:33
1315
原创 微信小程序-插槽slot
在页面使用自定义组件的时候,如果在自定义组件里面写子组件,子组件的内容无法显示。如上面的文本内容是无法显示在自定义组件里面的。因为如果我们想要自定义组件的内容也可以显示需要一个占位符或者卡槽,把子节点的内容插进去。
2024-07-01 22:49:01
2446
原创 微信小程序-自定义组件 properties
*** 组件的属性列表*///简写//全写label:{value:''},position:{)}
2024-06-27 23:18:33
1030
原创 微信小程序-自定义组件checkbox
组件的.js文件里的data用来定义数据,methods用来定义方法。和页面不同的是,组件的.js文件里里面是Component方法,页面的.js文件使用Page方法。页面文件不需要在methods里面定义function,组件需要。/*** 组件的属性列表*/},/*** 组件的初始数据*/data: {},/*** 组件的方法列表*/methods: {update(){isCheck:!})})
2024-06-26 22:45:30
782
原创 微信小程序-scroll-view实现上拉加载和下拉刷新
scroll-view组件通过自身一些属性实现上拉加载的功能。lower-threshold=“100"属性表示距离底部多少px就会实现触发下拉加载的事件。类似于在.json文件里面配置"onReachBottomDistance”: 100bindscrolltolower="getMore"属性是监听下拉加载的所绑定的方法。enable-back-to-top属性设置为ture表示点击状态栏或者标题栏回到顶部位置。
2024-06-20 23:29:09
1878
原创 微信小程序-上拉加载和下拉刷新
微信小程序的上拉加载使用onReachBottom(),写在.js文件里面的Page方法里面。onReachBottom()会监听微信小程序上拉操作。需要在.json文件里面配置"onReachBottomDistance"属性。如下面的代码,在距离底部50px的时候会触发到onReachBottom()
2024-06-19 23:03:34
906
原创 微信小程序-路由和页面跳转API
wx.navigateTo是通过编程实现页面跳转,和navigator组件组件中,open-type="navigate"属性类似,是保留当前页面跳转新的页面,不适用tabbar页面。类似组件。
2024-06-18 23:01:17
1075
原创 微信小程序-API 本地存储
存储 : wx.setStorageSync获取:wx.getStorageSync删除:wx.removeStorageSync清空:wx.clearStorageSync。
2024-06-17 23:02:11
631
原创 微信小程序-界面提示框和消息
小程序提供了wx.showLoading用来在加载界面的时候使用,比如果加载图片和数据的时候可以使用。常常和wx.hideLoading()配合使用,否则加载框一直存在。
2024-06-13 22:46:46
1409
原创 微信小程序-API介绍和发起网络请求
小程序提供丰富的API,以方便使用微信的能力。例如获取用户信息,微信登录,微信支付等。小程序的API几乎都在wx对象下。例如wx.request()异步API支持callback和Promise两种调用方式1.当接口参数不包含success/fail/complete时候,默认返回Promise2.部分接口request,uploadFile本身有返回值,不支持promise风格的调用,它们的promisify需要开发者自行封装。
2024-06-12 22:45:07
864
原创 小程序-生命周期(2) 应用周期/页面周期
应用周期指的是小程序:启动->运行->销毁的整个过程。应用周期伴随一些函数来进行控制,这些函数卸载app.js里面的App方法里。分别由onLaunch, onShow,onHide一次进行。onLaunch:初始化的时候运行(冷启动)onShow:初始化准备好,展示页面的时候运行(热启动,后台切前台)onHide:前台切后台。
2024-06-11 22:33:45
832
原创 微信小程序-生命周期(1)
微信运行时,会定期检查最近使用的小程序是否有更新。如果有更新,下次程序启动时会同步更新,更新到最新版本再打开小程序。如果用户长时间不使用小程序会强制检查版本更新。:在启动前没有发现更新,小程序每次冷启动时,都会检查是否有更新版本。如果发现有更新版本将会异步下载代码包,在小程序下一次冷启动的时候使用。本次依旧用的旧的代码包。在异步更新的时候,想要用户使用新的代码包,可以使用wx.getUpdateManager()进行强制更新。
2024-06-06 22:57:31
691
原创 微信小程序-条件渲染
使用wx:if , wx:elif , wx:else进行条件渲染,当条件为true的时候显示,否则不显示。在.wxml里面进行条件渲染否则都会报错。
2024-06-05 22:37:13
908
原创 微信小程序-双向绑定
使用{{value}}可以把data里面定义的值绑定到页面属性上,但是页面属性的值变动,并不会改变定义的变量值。如果我们想要定义的变量值进行改变,我们就需要进行双向绑定。
2024-06-04 22:21:32
1121
原创 微信小程序-声明和绑定事件
小程序页面使用的数据在Page()方法里使用data对象进行声明定义定义好之后,使用{{}}进行绑定{{}}里面可以进行如下运算。
2024-06-02 23:22:31
651
原创 微信小程序-事件(event)
微信小程序使用bind方法绑定事件第一种方式:bind:事件名第二种方式:bind事件名(简写)事件处理函数写在.js文件的page方法里面下面介绍两种事件对象button和input可以在.wxml里面创建button和input组件其中input组件创建好之后没有边框,需要在.scss里面添加边框方便查看然后在.js文件里面写相应的函数逻辑,函数名和绑定的事件名必须一致,且必须写在page方法里面,每个函数都会自带一个event参数。
2024-06-01 23:12:47
1046
原创 微信小程序-组件和样式(4)字体图标之阿里巴巴矢量图标库的使用
阿里巴巴矢量图表库的网址:阿里巴巴矢量图标库在搜索框输入我们需要的图标文本,比如首页/配送/时间等,就会搜索到各种文本图标:选中文本图标,点击购物车,选择项目:可以编辑首页项目,比如icon class的名称:点击生成在线链接,点击.css链接查看生成的CSS代码二.在微信小程序中使用阿里巴巴矢量图标库2.1 创建矢量图标库文件夹和文件注意:在引用之前需要在全局.scss文件里引用矢量.scss文件,使用@import关键字三.常见错误及解决办法官网解释,这种错误不影响小程序
2024-05-31 23:05:44
990
原创 微信小程序-样式和组件(3)navigator/scroll-view组件
scroll-x属性的值为ture,也可以只写属性scroll-x,默认值为true。在.wxml文件里面创建scroll-view组件,并在里面放着三个view。在.scss文件里面渲染scroll-view,通过class选择器。实现小程序横向和纵向的滚动。
2024-05-28 23:21:10
488
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人