
微信小程序
文章平均质量分 84
个人学习微信小程序相关技术的笔记和心得,以及一些小demo
杀死一只知更鸟debug
手敲博客 https://www.robindeblog.cn/,域名已过期,换赛道中!
展开
-
towxml的使用,在微信小程序中快速将markdown格式渲染为wxml文本
towxml3.0 支持以下功能:● echarts图表,默认禁用,需自行构建以开启此功能● LaTeX数学公式,默认禁用,需搭建解析服务并自行构建以开启此功能● yuml图表,默认禁用,需要搭建解析服务并自行构建以开启此功能● highlight代码高亮,默认开启(默认仅开启bash、javascript、json、python、html、css、php、scss、shell),其它语言高亮支持需自行构建以开启。原创 2023-10-21 21:29:45 · 2796 阅读 · 3 评论 -
微信小程序中 vant weapp 使用外部的icon作为图标的步骤
将这些解压的资源全部拷贝到微信小程序的assets目录中,并且将iconfont.css重命名为iconfont.wxss。首先在当前项目的根目录中,创建assets文件夹,用于存放静态资源,assets里面的文件夹可以自己定义,图片,css…添加一个图标到iconfont项目中,点击生成在线链接,记得选unicode,然后再生成在线链接(待会儿会使用)然后对iconfont.wxss进行编辑修改,将刚刚复制的在线链接,替换掉本地的链接。下载完毕之后,将压缩包解压,会得到类似下面的目录结构。原创 2023-09-09 09:34:17 · 3211 阅读 · 1 评论 -
微信小程序 - 调用微信 API 回调函数内拿不到 this 问题(解决方案)
tips: 本人是个小白选手,最近使用TP框架和微信小程序做前后端分离中(因为前端不是很懂),经常遇到的一个问题就是在微信小程序的内置API回调函数中,拿不到this的问题。然后百度了一下,发现最简单的问题解决方案就是在使用微信小程序内置API时,先使用一个变量来指代当前的this对象(指针,哈哈哈)原创 2023-09-07 17:06:29 · 837 阅读 · 0 评论 -
微信小程序给 thinkphp后端发送请求出现错误 Wrong number of segments 问题的解决 【踩坑记录】
微信小程序向后端发送请求时出现"Wrong number of segments"错误,通常是由于请求的URL路径不正确或请求参数不符合规范所导致的。检查请求的URL路径是否正确。确保你在微信小程序中发送请求时,URL路径是正确的。例如,如果你在ThinkPHP中定义了一个控制器名为"Index",并且该控制器有一个名为"test"的方法,那么正确的URL路径应该是类似于"http://example.com/index/test"的形式。检查请求的参数是否符合规范。如果你的控制器方法需要接收参数,确保你原创 2023-09-06 20:50:57 · 2109 阅读 · 0 评论 -
微信小程序分包的相关概念和使用
分包就是指将一个完整的小项目程序,按照需求划分为不同的子包,在构建时通过打包成不同的分包,用户使用时按需加载。对小程序分包的好处,简而易见,当我们首次打开小程序时下载时间变短,多团队共同开发可以分模块的解耦协作.主包,一般指只包含项目的 启动页面 或 TabBar 页面,以及所有分包都需要的一些公共资源app.json,app.wxss,js脚本和.wms脚本。分包,只包含和当前分包有关的页面和私有资源。分包后的体积限制:整个小程序的所有分包大小不超过 16MB,单个分包和主包大小不能超过 2MB。原创 2023-07-16 21:28:52 · 2396 阅读 · 0 评论 -
微信小程序安装和使用 Vant Weapp 组件库
Vant 是一个轻量、可靠的移动端组件库,于 2017 年开源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本,并由社区团队维护 React 版本和支付宝小程序版本。原创 2023-07-15 08:02:25 · 7481 阅读 · 0 评论 -
组件的插槽以及组件通信
可在父组件里调用 this.selectComponent(“id或class选择器”) ,获取子组件的实例对象,从而直接访问子组件的任意数据和方法。子组件要想获得父组件通过属性绑定的值的话,首先得在子组件的properties节点中声明同名的属性,然后才能使用。组件之间通信的三种方式:属性绑定(父->子),事件绑定(子->父),获取组件实例(父组件获取子组件的实例对象)在自定义组件的 wxml 结构中,可以提供一个 节点(插槽),用于承载组件使用者提供的 wxml 结构。子组件的.wxml结构。原创 2023-07-14 17:52:34 · 284 阅读 · 0 评论 -
组件的创建,引用,样式隔离以及methods,data,properties和数据事件监听
组件的创建,在项目的根目录下创建components文件夹(只是为了见名知意),然后点击右键新建component即可。点击新建component之后,会自动为你创建四个文件,.js,.json,.wxml,.wxss组件的引用方式分为“局部引用”和“全局引用”,局部引用:组件只能在当前被引用的页面内使用。全局引用:组件可以在每个小程序页面中使用。局部引用组件,只需要在需要使用该组件的页面的.json文件中进行配置即可。局部引用组件,只能在当前页面进行引用。格式如下,我们只需要在usingCompone原创 2023-07-14 10:40:11 · 264 阅读 · 0 评论 -
生命周期函数和wxs脚本
在 wxml 中引入外联的 wxs 脚本时,必须为 标签添加 module 和 src 属性,其中: module 用来指定模块的名称 src 用来指定要引入的脚本的路径,且必须是相对路径.wxml 中无法调用在页面的 .js 中定义的函数,但是,wxml 中可以调用 wxs 中定义的函数。wxs 代码还可以编写在以 .wxs 为后缀名的文件内,就像 javascript 代码可以编写在以 .js 为后缀名的文件中一样。小程序的页面生命周期函数,需要在页面中的.js文件中声明。原创 2023-07-13 09:19:04 · 1302 阅读 · 0 评论 -
微信小程序页面事件,下拉刷新事件和上拉触底事件
backgroundColor 用来配置下拉刷新窗口的背景颜色,仅支持16 进制的颜色值 backgroundTextStyle 用来配置下拉刷新 loading 的样式,仅支持 dark 和 light.比如,微信小程序中最常用的,一直往下滑,当快要到达底部时,数据会刷新并且填充到当前页面,这就是上拉触底事件。下拉刷新是移动端的专有名词,指的是通过手指在屏幕上的下拉滑动操作,从而重新加载页面数据的行为。上拉触底是移动端的专有名词,通过手指在屏幕上的上拉滑动操作,从而加载更多数据的行为。原创 2023-07-13 07:43:23 · 1531 阅读 · 0 评论 -
微信小程序开发学习之页面导航(声明式导航和编程式导航)
open-type 的值必须为 navigateBack ,表示要进行后退导航,delta的值必须为数字,表示后退的层级。通过声明式导航传参或编程式导航传参所携带的参数,可以直接在 onLoad 事件中直接获取到。编程式导航传参也是一个道理,我就拿一个wx.switchTab()来举例,其余也都是一样的。使用navigator组件传递参数,直接在其url上面拼接参数即可,例如。即可,其Object对象的参数与上面的switchTab一样。tabBar 页面指的是被配置为 tabBar 的页面。原创 2023-07-12 15:46:24 · 2202 阅读 · 0 评论 -
微信小程序之网络数据请求 wx:request的简单使用
我们可以在微信开发者工具中,临时开启「开发环境不校验请求域名、TLS 版本及 HTTPS 证书」选项,跳过 request 合法域名的校验。例如:请求黑马微信小程序课程的一个数据接口。出于安全性方面的考虑,小程序官方对。原创 2023-07-12 11:58:12 · 6779 阅读 · 0 评论 -
微信小程序中的条件渲染和列表渲染,wx:if ,wx:elif,wx:else,wx:for,wx:key的使用,以及block标记和hidden属性的说明
当condition条件为true时,代码块渲染显示,为false时,代码块不进行渲染.可以结合 wx:elif=“{{condition}}” 和 wx:else来进行判断1.2. block标记可以使用block标记,一次性的控制多个组件的显示与隐藏,block标记本身并不进行渲染。block并不是一个组件,它只是一个包裹性质的容器,不会再页面做任何渲染。从下面的例子来观察下,渲染出的页面结构有何特点:block标签未曾渲染,只是充当一个包裹性质的容器学过前端三剑客的应该看到这个属性就明白了,h原创 2023-07-12 08:06:04 · 4552 阅读 · 2 评论 -
微信小程序学习之数据绑定,事件绑定,事件传参与数据同步的学习记录
在data中定义数据,找到页面对应的.js文件,然后把数据定义到data中即可。/*** 页面的初始数据// 字符串类型的数据、 info : 'init data' , // 数组类型的数据 msgList : [ {在微信小程序绑定事件时,绑定的是事件名,所以无法通过绑定事件时传递参数,但是可以通过自定义属性来传递参数 data-* 的方式错误的事件传参< button bindtap = " btnTapHandler(123) " > 点我传递参数原创 2023-07-11 12:55:49 · 3830 阅读 · 0 评论 -
微信小程序常用组件的简单使用 view,scroll-view,swiper,swiper-item,text,rich-text,button,image
scroll-view组件就是滚动的视窗,使用scroll-view组件时,要想横向滚动或者纵向滚动时,需要在scroll-view组件上添加对应的属性 scroll-x 或 scroll-y,然后需要注意的是,纵向滚动需要给scroll-view组件限定高度,横向滚动则需要给scroll-view组件添加一个限定的宽度。swiper 和 swiper-item组件是微信小程序提供的用于快速构建轮播图的组件,swiper为轮播图的容器,swiper-item为轮播图的每一项。官网地址【swiper组件】原创 2023-07-11 08:38:36 · 8179 阅读 · 1 评论 -
微信小程序的目录结构及页面结构的说明
微信小程序的宿主环境就是微信App本身,和系统一个道理比如华为的Harmony ,苹果的ios,然后绝大多数手机的Android系统,安卓的应用无法在ios上面运行,反之也是一样,即。tips:.页面中的.wxss文件的样式会覆盖掉app.wxss文件的样式,同样页面中的.json文件也会将全局配置文件app.json文件的window中相同的配置项覆盖掉。微信小程序依赖于微信app,它可以借助微信完成许多普通网页难以做到的功能,比如最常用的微信支付,微信扫码,微信登陆等等以及微信为其提供的诸多api。原创 2023-07-10 22:17:54 · 2213 阅读 · 0 评论