微信小程序
文章平均质量分 65
无名之辈无名之辈
这个作者很懒,什么都没留下…
展开
-
微信小程序_25,自定义tabBar
添加徽标之后,徽标其实是溢出tabBar的,所以此时需要修改icon和底部文字的距离,而这里是需要修改margin-bottom。对于有的item需要渲染info,有的则不需要,可以在data节点中定义info,并在渲染时使用三元表达式来判断。要注意的是,给的模板代码中,可能有一些初始化数据,或是绑定的方法,这些东西也是要cv过来的。是当前tab的index,通过点击不同的tab,传入不同的index,再通过。而此时,先要完成切换,监听它的点击方法即可,点击事件中,执行。原创 2022-09-21 08:01:01 · 1260 阅读 · 0 评论 -
微信小程序_24,分包预下载
分包预下载指的是:在进入小程序的某个页面时,由框架自动预下载可能需要的分包,从而提升进入后续分包页面时的启动速度。在app.json中配置,该节点与。原创 2022-09-18 17:50:15 · 218 阅读 · 0 评论 -
微信小程序_23,分包
分包指的是把一个完整的小程序项目,按照需求划分为不同的子包,在构建时,打包成不同的分包,用户在使用时按需进行加载。2.当用户进入分包内某个页面时,客户端会把对应分包下载来,下载完成之后再进行展示。同时,还要在app.json的subpackages节点中声明分包的结构。在package.json中写下分包的配置,保存后会自动创建。1.在小程序启动时,默认会下载主包并启动主包内页面。指定的是分包的所在文件夹,指定的是该分包下的页面。在app.json中。原创 2022-09-16 16:03:33 · 865 阅读 · 0 评论 -
微信小程序_22,全局数据共享
注意:安装完相关的包之后,记得删除miniprogram_npm目录后.重新构建npm。在组件中引入store时,可以映射store中对应的对象或者变量名,如下面的。全局数据共享(又叫做:状态管理),是为了解决组件之间数据共享的问题。开发中常用的全局数据共享方案有:Vuex,Redux,Mobx等。原创 2022-09-13 21:00:07 · 844 阅读 · 0 评论 -
微信小程序_21,使用npm包,api promise化
在小程序入口文件中(app.js),只需调用一次promisifyAll()方法,即可实现异步api的promise化。注意,小程序是无法直接读取node_modules目录下的包文件的,所以需要构建,构建npm会把引入的包copy到。目录下,在你新引入包2时,最好将原来的。原创 2022-09-11 15:24:11 · 269 阅读 · 0 评论 -
微信小程序_20,使用第三方npm包
Vant Weapp是有赞前端团队开源的一套小程序UI组件库,助理开发者快速搭建小程序应用,他所使用的是MIT开源协议,对商业使用比较友好。在有package.json的目录中安装,如果没有package.json,那么初始化一下(为元素定义css变量时,需要为元素的根节点定义,而page就是小程序的根节点。总结:虽然npm上的包千千万,但是能供小程序使用的包却’为数不多’1.不支持依赖于node.js内置库的包。把小程序配置中的style给去除。各个元素的变量官方提供的有变量名。原创 2022-09-09 23:49:24 · 717 阅读 · 0 评论 -
微信小程序_19,自定义组件-behaviors
比如在组件的data节点定义一个username为ls,在behavior的data中也定义一个username为ls,那么此时它会优先使用组件中的data。每个behaviors可以包含一组属性,数据,生命周期函数和方法,组件引用它时,它的属性,数据和方法会被合并到组件中。behaviors是小程序中,用于实现组件间代码共享的特性,类似于vue的mixins。每个组件可以引用多个behavior,behavior也可以引用其他的behavior。behaviors挂载时,传入的是数组。...原创 2022-07-20 22:43:24 · 436 阅读 · 0 评论 -
微信小程序_18,父子组件之间的通信
这里点button,但是组件中的count并不会自加,因为界面上展示的count是来自父组件的值,这里就需要用到子组件向父组件传值,事件绑定。2.在父组件的WXML中,通过自定义事件的形式,将步骤1中定义的函数引用,传递给子组件。1.在父组件的js中,定义一个函数,这个函数即将通过自定义事件的形式,传递给子组件。4.在父组件的js中,通过e.datail获取到子组件传递过来的数据。3.在子组件的js中,通过调用。3.在子组件的js中,通过调用。,将数据发送到父组件。,将数据发送到父组件。......原创 2022-07-17 22:57:56 · 393 阅读 · 0 评论 -
微信小程序_17,插槽
在自定义组件的WXML结构中,可以提供一个节点(插槽),用于承载组件使用者提供的WXML结构。在小程序1中,默认每个自定义组件中只允许使用一个进行占位,这种个数上的限制叫做单个插槽。原创 2022-07-16 19:32:12 · 406 阅读 · 0 评论 -
微信小程序_16,组件的生命周期
2.在组件完全初始化完毕,刚进入页面节点树后,attached生命周期函数会被触发。有时,自定义组件的行为依赖于页面状态的变化,此时就需要用到组件所在页面的生命周期。这里就是组件监听了页面的状态,在每次进入页面时,生成一个随机的RGb值,1.组件实例刚被创建好的时候,created生命周期函数会被触发。3.在组件离开页面节点树后,detached生命周期函数会被触发。新旧两种方式都存在时,会优先使用新的,往后不建议使用旧的方式了。...原创 2022-07-16 17:56:30 · 1363 阅读 · 0 评论 -
微信小程序_15,纯数据字段
例如某些情况下,某些data中的字段既不会展示在界面上,也不会传递给其他组件,仅在当前组件内部使用,带有这种特性的data字段适合被设置为纯数据字段。概念纯数据字段指的是那些不用于界面渲染的data字段。好处纯数据字段有助于提升页面更新的性能。...原创 2022-07-15 23:00:39 · 348 阅读 · 0 评论 -
微信小程序_14,组件的创建与引用
1.在项目的根目录中,鼠标右键,创建components->test文件夹2.在新建的components->test文件夹上,鼠标右键,点击"新建component"3.键入组件的名称之后回车,会自动生成组件对应的4个文件,后缀分别为.js,.json,.wxml和.wxss如图:组件的引用方式分为"局部引用"和"全局引用",顾名思义:然后就可以在WXML中引用:WXML:然后就可以使用了根据组件的使用频率和范围,来选择合适的引用方式:从表面上看,组件和页面都是由,js,.json,.wx原创 2022-07-14 15:33:49 · 1067 阅读 · 0 评论 -
微信小程序_13,本地生活案例
以分页的形式,加载指定分类下商铺列表的数据1.接口地址:2.请求方式:3.请求参数:如果下面的公示成立,则证明没有下一页数据了页码值*每页显示多少条数据>=总数据条数page*pageSize>=total案例1:总共有77条数据,如果每页显示10条数据,则总共分为8页,其中第八页只有七条数据page(7)*pageSize(10)>=total(77)...原创 2022-07-08 19:37:34 · 676 阅读 · 4 评论 -
微信小程序_12,WXS脚本
WXS(WeiXin Script)是小程序独有的一套脚本语言,结合WXML,可以构建出页面的结构wxml中我们无法调用在页面的.js中定义的函数,但是wxml中可以调用wxs中定义的函数,因此,小程序中wxs的典型应用场景就是过滤器虽然wxs的语法类似于javascript,但是wxs和javascript是完全不同的两种语言1.wxs有自己的数据类型2.wxs不支持ES5及以上的语法形式3.wxs遵循CommonJS规范wxs代码可以编写在wxml文件中的标签内,就像javascript代码可以编写在h原创 2022-07-08 12:24:36 · 448 阅读 · 0 评论 -
微信小程序_11,生命周期
生命周期(life cycle)是指一个对象从创建->运行->销毁的整个阶段,强调的是一个事件段.例如:我们可以把每个小程序运行的过程,也概括为生命周期在小程序中,生命周期分为两类,分别是:1.应用生命周期其中,页面的生命周期范围比较小,应用程序的生命周期范围比较大,如图所示:生命周期函数:是由小程序框架提供的内置函数,会伴随着生命周期,自动按次序执行生命周期函数的作用:允许程序员在特定的时间点,执行某些特定的操作,例如,页面刚加载时,可以在obLoad生命周期函数中初始化页面的数据注意:生命周期强调的是时原创 2022-07-07 20:23:26 · 226 阅读 · 0 评论 -
微信小程序_10,页面事件
下拉刷新是移动端的专有名词,指的是通过手指在屏幕上的下拉滑动操作,从而重新加载页面数据的行为1.全局开启下拉刷新2.局部开启下拉刷新实际开发中推荐使用第二种方式局部开启:在全局或页面的.json配置文件中,通过backgroundColor和backgroundTextStyle来配置下来刷新窗口的样式,其中:如下面的例子中,button控制count的自增,下拉重置count为0(页面中不必要的代码没有copy)WXML:.js:当你下拉刷新时,其中的function会立即执行,但是下拉刷新的原创 2022-07-07 19:44:32 · 174 阅读 · 0 评论 -
微信小程序开发中的上拉触底的节流处理
如下图,往下面拖动时,会触发函数,获取颜色数据并使自增,但是你在数据没有返回之前多次触发上拉触底,那么就会多次request1.在data中定义idloading节流阀2.在getColors()方法中修改isloading节流阀的值3.在onReachBottom中判断节流阀的值,从而对数据请求进行节流控制示例:.js:触发上拉触底会判断一下的值,如果为true,则不请求,如果为false,则请求...原创 2022-07-07 17:06:48 · 855 阅读 · 0 评论 -
微信小程序_9,视图与逻辑
页面导航指的是页面之间的互相跳转,例如:浏览器中实现页面导航的方式有如下两种1.链接2.location.href1.声明式导航:2.编程式导航:tabBar页面指的是被配置为tabBar的页面在使用组件跳转到指定的tabBar页面时,需要指定url属性和open-type属性,其中:注意,这里tabBar配置的页面是需要在中的节点下配置了的页面才会进行跳转!导航到非tabBar页面:非tabBar页面指的是没有被配置为tabBar的页面在使用组件跳转到非tabBar页面时,则需要指定ur原创 2022-06-25 23:08:17 · 132 阅读 · 0 评论 -
微信小程序_8,项目练习,本地生活
1.新建项目并梳理项目结构2.配置导航栏效果3.配置tabBar效果4.实现轮播图效果5.实现九宫格效果6.实现图片布局demo:项目demo文件原创 2022-06-22 23:09:13 · 444 阅读 · 1 评论 -
微信小程序_7,网络数据请求
出于安全性方面的考虑,小程序官方对数据接口的请求做出了如下两个限制:1.只能请求HTTPS类型的接口2.必须将接口的域名添加到信任列表添加到信任列表:需求描述:假设在自己的微信小程序中,希望请求域名下的接口配置步骤:登录微信小程序管理后台->开发->开发设置->服务器域名->修改request合法域名注意事项:1.域名只支持https协议2.域名不能使用IP地址或localhost3.域名必须经过ICP备案4.服务器域名一个月内最多可申请5次修改下面这里是有问题的,实际上是每个月只能修改五原创 2022-06-20 19:53:06 · 628 阅读 · 0 评论 -
微信小程序_6,页面配置
小程序中,每个页面都有自己的.json配置文件,用来对当前页面的窗口外观,页面效果等进行配置小程序中,app.json中的window节点,可以全局配置小程序中每个页面的窗口表现如果某些小程序页面想要拥有特殊的窗口表现,此时"页面级别的.json配置文件"就可以实现这种需求.注意:当页面配置与全局配置冲突时,根据就近原则,最终的效果以页面配置为准例如:index的WXML:person的WXML:......原创 2022-06-19 16:47:35 · 221 阅读 · 0 评论 -
微信小程序_5,全局配置
1.pages了解window节点常用的配置项:app.json->window->navigationBarTitleTextapp.json->window->navigationBarBackgroundColor修改导航栏文字颜色:app.json->window->navigationBarTextStyle注意这里的可选值只有black/white概念:下拉刷新是移动端的专有名词,指的是通过手指在屏幕上的下拉滑动操作,从而重新加载页面数据的行为app.json->window->ena原创 2022-06-19 16:11:21 · 1212 阅读 · 0 评论 -
微信小程序_4,WXSS模板样式
WXSS(WeiXin Style Sheets)是一套样式语言,用于美化WXML的组件样式,类似于网页开发中的cssWXSS具有CSS大部分特性,同时WXSS还对CSS进行了扩充以及修改,以适应微信小程序的开发,与CSS相比,WXSS扩展的特性有:rpx的实现原理非常简单,鉴于不同设备屏幕的大小不同,为了实现屏幕的自动适配,rpx把所有的设备的屏幕,在宽度上等分为750份(即:当前屏幕的总宽度为750rpx)小程序在不同蛇摆上运行的时候,会自动把rpx的样式单位换算成对应的像素单位来渲染,从而实现屏幕适配原创 2022-06-19 14:20:09 · 390 阅读 · 0 评论 -
微信小程序_3,WXML模板语法
事件是渲染层到逻辑层的通讯方式,通过事件可以将用户在渲染层产生的行为,反馈到逻辑层进行业务的处理当事件出回调触发的时候,会受到一个事件对象event,它的详细属性如下表所示:在开发中,用的比较多的是:,target是触发该事件的源头组件,而currentTarget则是当前事件所绑定的组件,举例如下:点击内部的按钮,点击事件以冒泡的方式向外扩散,也会触发外层view的tap事件处理函数在小程序中,不存在HTML中的onclick鼠标点击事件,而是通过tap事件来响应用户的触摸行为1.通过bindtap原创 2022-06-16 22:24:25 · 218 阅读 · 0 评论 -
微信小程序_2小程序-模板及其配置
微信小程序一些语法格式原创 2022-06-14 22:18:10 · 128 阅读 · 0 评论 -
微信小程序_1,基础配置及其开发工具
微信小程序开发,学习,原创 2022-06-12 17:08:40 · 4074 阅读 · 3 评论