微信小程序加表情
原生的textarea已经把选择表情的按钮丢弃了，所以自己就模拟了一个表情选择器下面是效果展示实现原理准备工作表情可以在qq表情地带中查看通过 escape() 和 unescape() 两个函数来对表情进行解析和重构escape("????") // %uD83D%uDE04unescape("%uD83D%uDE04") // ????这里返回的表情是十六进制的，为了计算...
2024-01-10
微信小程序数据遍历
制作数据遍历的步骤在index.js中加入数据。在index.wxml中读取数据。wx:for-item可以指定数组当前元素的变量名wx:for-index可以指定数组当前下标的变量名这两个项也可以不指定，默认数组的当前项的下标变量名默认为index，数组当前项的变量名默认为item。类似block wx:if，也可以将wx:for...
2024-01-10
详解微信小程序中组件通讯
这篇主要讲组件通讯（1）父组件向子组件传值：<header title='{{title}}' bind:fn='fn' id='header'></header>通过title='{{title}}'传向子组件向子组件传递参数子组件接收参数：Component({ properties: { title: { // 属性名 type: Number, // 类型（必填） type: String,//目前接受的类型包括：String, Number, Boolean, Object, Arra...
2024-01-10
微信小程序获传值取值方法
微信小程序传值以及获取值方法，传值有两种方法，对应也有获取值得方法，1、设置id的方法标识跳转后传递的参数值；2、通过使用data - xxxx 的方法来标识要传递的值微信小程序设置id的方法标识来传值在要跳转的item处，设置一个id并给当前的id赋值上对应的key值，比如一部电影的id（后面...
2024-01-10微信小程序实现复选框效果
本文实例为大家分享了微信小程序实现复选框片展示的具体代码，供大家参考，具体内容如下样式部分你们自由发挥，反正这里是什么都没写的，选中和没选中直接用这个this.data.arrStatus[checkIndex]去判断就行了，之后你们都懂的。效果预览：js部分// page/index/index.jsPage({ /** * 页面的初始数据 */ d...
2024-01-10微信小程序实现原生步骤条
本文实例为大家分享了微信小程序实现原生步骤条的具体代码，供大家参考，具体内容如下效果（步骤条颜色不对是录制工具的问题）思路其实与轮播图类似，使用了两个并排的轮播容器，在滑动监听后，给图片加上移动和缩放动画。扩展可以用于标签页的切换。vue与微信小程序有类似的地方，...
2024-01-10微信小程序 生命周期详解
微信小程序 生命周期通俗的讲，生命周期就是指一个对象的生老病死。 从软件的角度来看，生命周期指程序从创建、到开始、暂停、唤起、停止、卸载的过程。下面从一下三个方面介绍微信小程序的生命周期：应用生命周期页面生命周期应用生命周期影响页面生命周期》》》应用生命周期用...
2024-01-10微信小程序实现跑马灯效果
网上很多实现跑马灯的文章，但是很多发现都是不行的，之一就是文字宽度居然是通过字符数*文字size计算，明显是不准确的计算方式。我看了下，发现可以通过计算控件宽度来精确计算文字宽度，这样实现的跑马灯是比较完善的。效果如下：实现代码如下：wxml:<view class="rollCon"> <view class='box'> <v...
2024-01-10微信小程序实现侧边栏分类
本文实例为大家分享了微信小程序侧边栏分类展示的具体代码，供大家参考，具体内容如下效果图实现思路把屏幕当成一个固定的盒子，然后把盒子分成两边，并让盒子的每一边都能够滚动。源码index.wxml<!--主盒子--><view class="container"> <!--左侧栏--> <view class="nav_left"> <block wx:for="{{title}}" wx:for-ite...
2024-01-10微信小程序商品到详情的实现
微信小程序商品到详情结构代码资源分享给大家.商品页post.wxmldata-postid="{{index}}view class="container" swiper indicator-dots indicator-color="rgba(255,255,255,0.3)" indicator-active-color="rgba(255,255,255,1)" autoplay swiper-item image src= ...商品页 post.wxmldata-postid="{{index}}...
2024-01-10微信小程序渲染性能调优小结
网页的性能优化是前端开发老生常谈的热门话题，其中微信小程序因其页面双线程架构设计，所以性能优化的手段跟传统的 H5 应用不太一样。今天主要介绍一下微信小程序页面双线程架构的特性给页面渲染带来的一些影响，以及应对的一些渲染性能调优策略。为了叙述方便，下文会把微信小程序简称...
2024-01-10安卓版微信小程序跳一跳辅助
今天一上班 被github上的一篇名为《教你用python玩跳一跳》吸引，它的星也瞬间从3400涨到4400 原作者主要就是用python 脚本去 玩微信小程序跳一跳，本次是基于安卓机型配合Mac电脑进行测试ios版本请移动 ios 直通车点击打开链接ios 直接改分版本戳这里 飞机票大致就是需要先去安装adb 然后执行...
2024-01-10微信小程序实现循环动画效果
在微信小程序的交互效果中，通常通过各种动画效果来增强用户体验，本文通过微信小程序原生API来实现小程序中控件的各种动画效果，先看下本文最终的效果： 上图中的“关注公众号”动画就是我们要实现的效果。 为了实现上文中的效果，我们首先来看一下微信小程序关于动画的官方API微信...
2024-01-10微信小程序学习之初探小程序
前言9月21日，传言已久的微信应用号正式以“微信公众平台小程序”的名义发布，依然采取了内测制度，目前只有少部分开发者可使用。“微信之父”张小龙在朋友圈介绍，这种小程序是一种不需要下载安装即可使用的应用，用户扫一扫或者搜一下即可打开应用，对用户来说应用触手可及，对微信来...
2024-01-10微信小程序App生命周期详解
微信小程序App生命周期：onLaunch—-当小程序初始化完成时，会触发 onLaunch（全局只触发一次）onShow —-当小程序启动，或从后台进入前台显示，会触发 onShowonHide —-当小程序从前台进入后台，会触发 onHideonError —-当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息//app.jsApp...
2024-01-10微信小程序版本自动更新的方法
公司的小程序项目上线, 后期还会有小型的版本迭代. 为了让用户能在我们进行版本迭代后及时使用最新版本的功能. 做了以下优化..知识点1: 当用户点击左上角关闭，或者按了设备Home 键离开微信，小程序并没有直接销毁，而是进入了后台；当再次进入微信或再次打开小程序，又会从后台进入前台，...
2024-01-10
微信小程序静默授权的两种方式
微信小程序授权的两种方式解密授权 wx.getUserInfoAPI文档地址js_code授权 auth.code2Session服务端文档小程序测试号地址地址这里进行扫码登陆的时候注意，如果登陆上去，没有appId等信息，就请先登陆微信开放社区，然后在打开测试号进行查看第一种需要小程序前端调用登陆，在调用获取用...
2024-01-10微信小程序实现工作时间段选择
本文实例为大家分享了微信小程序工作时间段选择的具体代码，供大家参考，具体内容如下1. 效果图如上，需完成时间段的选择 以及下面的工作日选择 保存按钮为formSubmit提交后台2.思路：①时段用picker跟input 如果没有占位字符 则不需要input②工作日选择用checkbox 多选的样式用label 将checkbox...
2024-01-10
微信小程序实现可长按移动控件
微信小程序可长按移动控件，供大家参考，具体内容如下–包含超出边界监测，性能不够理想【原因：setData在毫秒级刷新时会极大程度影响渲染性能】JavascriptPage({ /** * 页面的初始数据 */ data: { //浮动按钮坐标 flow_y: 130, flow_x: 20, pre_y:0, pre_x:0, //标记移动 moveFlag: false, //标记控件是否可放置...
2024-01-10微信小程序 下拉菜单简单实例
微信小程序 下拉菜单简单实例wcss /**DropDownMenu**/ /*总菜单容器*/ .menu { display: block; height: 28px; position: relative; } /*一级菜单*/ .menu dt { font-size: 15px; float: left; /*hack*/ width: 33%; height: 38px; border-right: 1px solid #d2d2d2; border-bottom: ...
2024-01-10详解微信小程序调起键盘性能优化
在小程序中，我们经常有调起键盘的操作场景，但是在不同的场景下解决方案不尽相同，还是需要具体问题具体分析。需求分析最近在项目中有一个需求，是从列表页点击评论按钮进入详情页时，在加载完页面后自动调起键盘进入评论状态。从需求来看，我们应该在onReady函数中调起键盘，因为onReady...
2024-01-10
微信小程序自定义底部弹出框动画
微信小程序之自定义底部弹出框动画，供大家参考，具体内容如下最近做小程序时，会经常用到各种弹框。直接做显示和隐藏虽然也能达到效果，但是体验性太差，也比较简单粗暴。想要美美地玩，添加点动画还是非常有必要的。下面做一个底部上滑的弹框。wxml<view class="modals modals-bottom-dialog" hidde...
2024-01-10微信小程序实现全国机场索引列表
本文为大家分享了微信小程序实现MUI索引列表的具体代码，供大家参考，具体内容如下效果展示图实现的原理‘当前选择机场'和右侧的导航栏采用的是固定定位；左侧的展示窗口的滚动采用的是scroll-view组件；选择中的字母提示是自己WXSS样式制作。WXML<view class="right-nav"> <view bindtap="getCurrentCode...
2024-01-10微信小程序实现渐入渐出动画效果
前言在做小程序列表展示的时候，接到了一个需求。需要在列表展示的时候加上动画效果。设计视频效果如下图：需要在进入列表页的时候，依次展示每一条卡片，在展示完成后需要隐藏掉当天之前的卡片。实现思路实现该动画效果，首先需要给每个卡片添加一个css动画。因为每个卡片的显示是...
2024-01-10微信小程序实现手势滑动卡片效果
最近工作中有项目要使用微信小程序技术进行开发，其中一项功能困扰了我很久，卡片滑动动效以及手势识别。经过一番研究和参考，现在把成果展示。记录自己踩到的坑，如果大家有需要，也可以帮助到大家。效果图：首先是卡片布局的实现：图片（一）如图所示，我采用绝对定位absolute的方式...
2024-01-10
