01 2023 档案
摘要：实现效果 在导出表格数据的时候，通常分为两种情况 页面列表数据导出 接口返回数据导出 这里主要介绍接口返回数据导出，关于页面的列表数据导出，请看另一篇：vue3+element表格数据导出 接口返回数据导出，通常需要请求后端接口获取数据，接口返回的数据基本上是乱码的，需要先处理乱码的数据，否则导出来
阅读全文
摘要：这里主要用到微信小程序提供的SelectorQuery获取页面节点信息实现，组件用的是微信小程序的scroll-view 逻辑就是获取右侧盒子的节点信息，获取右侧子分类的节点信息，当子分类滑动到顶部的之后，则切换左侧分类状态，而且当右侧子分类的位置处于触顶以及包含顶部位置的状态下，同样激活左侧分类状
阅读全文
摘要：微信小程序的跳转方式 wx.navigateTo(Object)：保留当前页面，跳转到应用内的某个页面，使用 wx.navigateBack 可以返回到原页（新页面入栈） wx.redirectTo(Object)：关闭当前页面，跳转到应用内的某个页面（当前页面出栈，新页面入栈） wx.switch
阅读全文
摘要：微信小程序闭包-防抖 这里主要用到闭包，将函数内的值保存下来，下次点击的时候进入判断，如果定时器启动了，则清除定时器，直到最后一次启动定时器，也就是说，在规定的时间内只会触发最后一次定时器，从而达到防抖效果。 防抖的使用场景： 防止连续快速点击 防止滚动条触底时的频繁事件触发 方法一： data:
阅读全文
摘要：盲盒模块的流程大致如下： 进入盲盒抽奖页面，需要初始化直接获取一些盲盒的信息，例如：盲盒活动id，开奖buff等。首先需要获取盲盒活动id，后面的所有请求都是基于盲盒活动id进行的。 初始化获取: 盲盒活动id` 抽奖buff 校验抽奖活动状态：判断当前活动是否开启 抽奖次数：获取当前活动的抽奖次数
阅读全文
摘要：当我们程序太大的时候，打开小程序就会比较慢，此处就需要用到分包加载，按照模块划分不同的包，让用户在需要的时候才加载对用的模块，也就是用户在进入某些页面的时候才下载该页面的资源，提高小程序的打开速度，以及首次加载资源的速度。 通常情况下，我们建的文件都在根文件夹下的pages里面 根文件夹其实就是主包
阅读全文
摘要：效果： 步骤： 1、先让ui负责人把你的账号加入到项目中，加入到项目中后就可以在icon图标库中看到该项目 2、在小程序中使用 新建一个view，在上面加一个class，复制icon名字上去即可，注意格式，格式为iconfont icon名。 iconfont这个前缀不是固定的，根据icon名字来，
阅读全文
摘要：场景： 传入数字，转换成天数，比如：index = 1 转换后则为 一，在页面中的应用就是<view>第{{index}}天</view>，转为第几天。 <view>第{{exchange.exChangeNum(index)}}天</view> <wxs module="exchange"> /*
阅读全文
摘要：wxs封装 wxs可以直接写在wxml页面中，并且在对应的位置调用，比如在{{ xxx.xxx() }}调用wxs的函数 <view> <view>第{{m1.getMax(1)}}天</view> </view> <wxs module="m1"> var getMax = function(in
阅读全文
摘要：封装组件 1、在components文件加下新建组件文件夹，在该文件夹下新建组件 2、在app.json中注册该组件 "usingComponents": { "page": "components/auth/index", "componentB":"/components/componentB/
阅读全文
摘要：自定义微信小程序头部导航栏，有几种方式 方式一 { "navigationStyle": "custom" // 将navigationStyle从默认default改为custom } 定义此方法后，头部的导航栏会去掉，导航栏下的元素会直接向上移动到原导航栏的位置，可以再app.json配置成全局
阅读全文
摘要：微信小程序的支付只要用到官方的支付API ： wx.requestPayment(Object object) 官方文档地址：https://developers.weixin.qq.com/miniprogram/dev/api/payment/wx.requestPayment.html 调用微
阅读全文
摘要：微信小程序的转发功能，参考官方文档，使用的buttom的open-type功能，下面是转发功能的具体实现。 // 通过按钮的 open-type="share"实现转发，触发onShareAppMessage函数 <button open-type="share">转发</button> // 用户
阅读全文
摘要：在做收货地址的时候，通常会让用户填写或者打开地图选择收获地址，此时就需要用到微信提供的地址API，在使用地址API的时候需要注册对应的API，而且地址API会经常调整，需要关注官方公告，下面就是关于地址API的使用。 第一部分 先看下此设置有没有打开 进入微信开发者文档，在API下找到位置，此处就是
阅读全文
摘要：下面提供几个解决方案 方案一： 官方文档有说明，将 app.json 中的 "style": "v2" 去除，小程序的新版基础组件强行加上了许多样式，难以覆盖，不关闭将造成部分组件样式混乱。 方案二： 网上说了很多解决方案，例如： 1、可能是布局样式有冲突 推测可能是flex 布局 2、app.js
阅读全文
摘要：一般常用的微信小程序跳转分为两种 1、非TabBar跳转 2、TabBar跳转 1、非TabBar跳转 非TabBar页面的跳转通常使用wx.navigateTo来跳转页面，在链接后面加 ？ 传参，如下： // 跳转页面 ? 后面传参 goods_id = 参数 wx.navigateTo({ ur
阅读全文
摘要：request文件 // 封装请求 const baseURL = 'https://api-hmugo-web.itheima.net/api/public/v1' const request = (options) => { // return new Primise才可以使用then或者asy
阅读全文
摘要：1、微信小程序的数据更新 Page({ // 响应式的数据定义在data里面 data: { bannerList: [] }, // 微信小程序的数据更新是在setData里面做的 this.setData({ bannerList:res.data.message }) }) 2、请求接口如果报
阅读全文
摘要：泛型 给函数或者属性定义类型的时候，类型是固定的，当业务发生变动时可能不好维护，例如：函数类型固定为string,后续需求更改不好维护，比如需要传入number类型，那么这个函数就不适用了 function add( val : string) : string{ return val } 为了解决
阅读全文
摘要：可选参数--默认参数 在ts中定义的数据类型，某些情况下只需要传入定义数据类型的一部分参数，比如：id 、name、age、address，此时需要修改用户的名称，那么只需要传入id、name就够了；某些情况下需要修改用户的所有信息，需要传入全部参数；可以定义两个接口分别接收，但在这里定义一个接口也
阅读全文
摘要：在开发中有些功能是通用的，而且逻辑大致相同，像这种东西可以封成一个组件，比较常用的就是函数封装，组件封装，组件封装是需要引入到页面使用的，所以通常它会有一些自己的方法，父子组件可以通过一些值来进行关联，这种方式也就是我们所说的组件传值，vue3+ts的组件传值其实就是组件传值加上了数据类型约束，并没
阅读全文
摘要：class可以用来做数据的存储与回显，能将页面的数据分离出来并提取到class内，函数也可以抽离到class，实例化class进行调用。ts中的class类与js的class类基本相同，不同点在于ts的class有数据类型约束，在使用class的时候，必须遵循定义的数据类型约束，class中有一个c
阅读全文
摘要：在使用函数的时候，通常会给函数传值，或者给函数一个返回值调用，这个时候就会涉及到函数类型。 函数类型分为两个方面： 1、函数参数 2、函数返回值 语法： function 函数名( 参数 : 参数类型 ) : 返回值类型 { return 返回值 } 函数有几种不同的写法，分别为：声明函数、匿名函数
阅读全文
摘要：联合类型 在实际开发中，我们接收的变量可能不是一个固定的数据类型，而是动态的多个数据类型，此时用单个固定的数据类型去接收很明显是不行的，为了解决这种可能会接收多个不同数据类型的变量就需要用到联合类型。联合类型表示取值可以为多种类型中的一种。 语法：let 变量名 : 数据类型 | 数据类型2 = 值
阅读全文
摘要：object是一个对象，在ts中定义对象类型的语法为：let 变量名 ：object = { } 在object类型中，对象内部定义的值是不受类型约束的，只要是一个object类型即可，例如： let obj : object = { name : '艺术概论', // 字符串 price : 99
阅读全文
摘要：any类型 any类型，在ts中是一个万能类型，它可以替代所有类型，也就是说定义了any类型，就不用担心ts的类型束缚，但如果所有的类型都使用any那么ts就失去了它的作用，我们使用ts就是为了规范类型，any的主要使用场景是当一个值不确定的时候使用，此外要避免滥用any类型。 语法：let 变量名
阅读全文
摘要：ts中，枚举类型就是，枚举里面的每个数据值都可以叫做元素，每个元素都有自己的编号，编号是从0开始的，依次递增加1 ， 语法： enum 枚举名 {} 此处定义一个枚举类型，例如： enum Color{ red, // 0 green, // 1 blue // 2 } 在枚举类型中，属性的位置默认
阅读全文
摘要：数组 在ts中，定义数组类型语法： let 变量名 ： 数据类型[] = [值1,值2,值3] let arr1 : number[] = [1,2,3,4] console.log(arr1); // 输出 [1,2,3,4] 此外数字类型的定义还可以使用==泛型==，关于==泛型==的内容，下面
阅读全文
摘要：在ts中定义基础类型， 语法 ： let 变量名 ： 数据类型 = 值 // 布尔类型 boolean let flag : boolean = true flag = false 在赋值的时候，不能赋值定义外的数据类型，例如 flag = 100 // 报错 报错，不能将数字复制给 boolean
阅读全文
摘要：接口 接口也相当于语法规范，在使用ts编写的时候，需要注重的就是数据类型以及语法规范，恰好这里提供了一个接口，在进行传值的时候，传值的类型以及字段必须符合我们预期的类型规范才可以，下面是代码演示 语法：interface 接口名 { 参数名 : 数据类型 } ，例如： interface IPers
阅读全文
