小程序
文章平均质量分 60
yshir-phper
这个作者很懒,什么都没留下…
展开
-
微信小程序-路线规划,地图导航功能基于高德地图API
主要实现微信小程序中的地图路线规划和地图导航功能小程序二维码:更新2018年4月18日:新增限行限号查询。2018年5月7日:新增快递查询,模板消息发送。准备1、在http://lbs.amap.com/申请key2、在微信小程序后台把restapi.amap.com添加进request合法域名本文知识点1、微信小程序基本构架2、页面之间跳转3、在当前...转载 2019-09-01 15:05:00 · 1966 阅读 · 2 评论 -
微信小程序 WebSocket 链接(ThinkPHP)
gateClient是用来辅助 workerman或者是gateway进行用户分组以及向用户发送信息的组件,同时,能够快速便捷的将原有系统的uid和clientid绑定起来。gateway-worker(后面直接称gateway)是基于 workerman 开发的TCP长连接框架,用于快速开发TCP长连接应用。支持高并发,超高稳定性,被广泛的用于手机app、移动通讯等领域的开发。在线聊天一般都是实用长连接保持通信,使用 workerman 虽然能够做到同样的效果,但是gateway更加的方便快捷。转载 2023-02-09 16:13:22 · 1187 阅读 · 0 评论 -
微信小程序中跳转另一个小程序(两种方式)
小程序跳小程序转载 2022-06-22 11:22:40 · 9617 阅读 · 1 评论 -
微信小程序 获取用户的昵称和头像
微信小程序 获取用户的昵称和头像转载 2022-09-06 09:16:11 · 7170 阅读 · 0 评论 -
小程序 文字太长显示不完,滚动文字效果
1、解决思路:一共两个text控件,当第一个text滚动完后应该是看到第二个text控件了,但是在这个时候最好的方法不是让它滚完,而是用重新又从第一个text控件开始滚动,控制起来超级简单,基本实现了跑马灯的效果,另外加了一个如果文字不足一屏,不执行跑马灯的效果,而且添加了超大的间距,解决不会显示重复内容。以下是各部分完整代码,只要复制代码添加到相应页面即可看到效果。2、小程序布局页面wxml<scroll-view class="container" enable-flex=...转载 2022-01-24 10:03:05 · 1607 阅读 · 0 评论 -
实战解决小程序图片加载问题
小程序图片加载转载 2021-12-01 09:51:03 · 6092 阅读 · 2 评论 -
微信小程序——text组件(文本)
text文本在使用小程序时,如果想通过长按文字进行复制文字内容,就要把该内容写在text中。属性 类型 默认值 必填 说明 最低版本 selectable boolean false 否 文本是否可选 (已废弃) 1.1.0 user-select boolean false 否 文本是否可选,该属性会使文本节点显示为 inline-block 2.12.1 space string原创 2021-07-22 12:54:26 · 2622 阅读 · 0 评论 -
微信小程序开发之表单验证(WxValidate使用)
微信小程序的开发框架个人感觉大体上跟VUE是差不多的,但是他的表单组件没有自带的验证功能,因此开发小程序的表单验证时候一般有两种方法,一是自己裸写验证规则,但是需要比较扎实的正则表达式基础,一种是利用官方社区开发的WxValidate插件进行表单验证。WxValidate插件是参考 jQuery Validate 封装的,为小程序表单提供了一套常用的验证规则,包括手机号码、电子邮件验证等等,同时提供了添加自定义校验方法,让表单验证变得更简单。首先插件的下载地址和官方文档都在WxValidate下载地转载 2021-03-26 08:55:19 · 1164 阅读 · 0 评论 -
微信小程序授权登录
微信的详细登录流程如下 图前言首先 要明白 授权登录是为了什么 ?授权登录是为了要获取用户得信息、昵称、以及头像id,如果没有授权登录,用户无法正常使用小程序软件微信小程序 是授权登录时是直接可以通过getUserInfo接口 弹出授权弹窗一、 怎么使用 getUserInfo使用 button 组件,并将 open-type 指定为 getUserInfo 类型,获取用户基本信息就是 通过点击按钮 触发 getUserInfo 接口 获取用户信息用户一点击 授权登录 就可以获取到转载 2021-03-09 20:54:38 · 308 阅读 · 0 评论 -
微信小程序三种授权登录的方式
经过一段时间对微信小程序的研发后 总结出以下三种授权登录的方式,我给他们命名为‘一次性授权’‘永久授权’‘不授权’演示站1.一次性授权常规写法,需要获取用户公开信息(头像,昵称等)时,判断调取授权登录接口,但是此方法如果不经处理的话 用户如果拒绝授权或者删除该微信小程序后 需要重新调取并获取用户公开信息(头像,昵称等),此方法用户体验较差,不建议使用;2.永久授权在不必要使用用户公开信息(头像,昵称等)时,不调取授权登录接口,只有在必要的时候再去判断调取授权登录接口并把获取到的用户公开信息存入.转载 2021-03-09 20:49:59 · 7206 阅读 · 0 评论 -
微信小程序授权功能
思路:1.首先获取授权,看看到底有没有这个授权,如果有,那么就不再进行再次请求,如果没有,那么再次请求或者其他的业务逻辑。2.查看授权信息接口:wx.getSetting(Object object),后面我们具体分析这个接口如何使用3.通过来调取授权<button open-type='getUserInfo' bindgetuserinfo="getUserInfo"></button>业务代码:获取用户授权信息// 获取微信授权信息// ...转载 2021-03-09 20:47:28 · 382 阅读 · 0 评论 -
微信小程序——scroll-view组件(可滚动视图)(四)
scroll-view可滚动视图垂直滚动:wxml代码:<scroll-view scroll-y scroll-top="{{scrollTop}}"> <view id="green" class="scroll-view-item bc_green"></view> <view id="red" class="scroll-view-item bc_red"></view> <view原创 2021-01-28 20:06:12 · 310 阅读 · 0 评论 -
微信小程序视图容器之swiper滑块详解(三)
swiper滑块视图容器。其中只可放置swiper-item组件,否则会导致未定义的行为。属性 类型 默认值 必填 说明 最低版本 indicator-dots boolean false 否 是否显示面板指示点 1.0.0 indicator-color color rgba(0, 0, 0, .3) 否 指示点颜色 1.1.0 indicator-active-color color原创 2021-01-28 17:50:56 · 3052 阅读 · 0 评论 -
uni-app微信小程序配置(三)
uni-app官网:https://uniapp.dcloud.io/collocation/pagespages.json文件用来对 uni-app 进行全局配置,决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。它类似微信小程序中app.json的页面管理部分。注意定位权限申请等原属于app.json的内容,在uni-app中是在manifest中配置。配置项列表1、pagesuni-app通过 pages 节点配置应用由哪些页面组成,pages 节点接收一..原创 2021-01-26 23:36:47 · 3317 阅读 · 0 评论 -
uniapp小程序初体验(二)
一、通过vue-cli创建uni-app项目命令:npm install -g @vue/cli @2选用hello ui-app模板接下来切换到文件目录下,运行npm run serve命令原创 2021-01-26 23:11:42 · 355 阅读 · 0 评论 -
uni-app搭建小程序
一、uni-app脚手架搭建1、全局安装(只需要安装一次)npm install -g @vue/cli2、创建项目vue create -p dcloudio/uni-preset-vue my-project(my-project为你的项目名称)3、启动项目(微信小程序)npm run dev:mp-weixin4、微信小程序开发者工具导入项目二、搭建过程可能出现的问题1、容易出现vue和vue-templage-complier版本不一致的问题此时根据提示重新安装对应的vu原创 2021-01-16 16:42:20 · 2822 阅读 · 0 评论 -
taro学习笔记(一)
一、taro 简介taro 是一套遵循react语法规范的多端开发解决方案。使用taro,只书写一套代码,再通过taro的编译工具,将源代码分别编译出可以在不同端(微信小程序、H5、RN等)运行的代码。二、安装安装taro开发工具 @tarojs/cli#使用npm或者yarn全局安装,或者直接使用npxnpm install -g @tarojs/cliyarn gl...原创 2019-11-28 12:49:59 · 427 阅读 · 0 评论 -
微信小程序开发之扫码 扫一扫 wx.scanCode()
效果:JS代码:let app = getApp(); Page({ data: { img: "/images/1.jpg" }, onLoad() { }, scan() { wx.scanCode({ success: (res) => { console.log("扫...转载 2019-09-01 15:01:24 · 2382 阅读 · 0 评论 -
支付宝小程序第三方应用服务端获取用户信息
支付宝小程序搞定了,想再搞一个第三方应用模版开发模式业务接入小程序第三方接入文档:https://docs.alipay.com/isv/10436/kcs4o3获取用户信息流程如下:1. 创建第三方应用2. 第三方应用开发配置3. 创建小程序模版(前置条件:第三方应用审核通过)4. 配置小程序模版IDE开发配置可以看到菜单「成员管理」开发成...转载 2019-09-01 15:00:26 · 2181 阅读 · 0 评论 -
微信小程序授权登录
微信小程序授权一般可以获取用户的openid、昵称、头像、用户所在省和市、性别①、首先引导用户点击授权按钮 1 <button open-type="getUserInfo"bindgetuserinfo="bindGetUserInfo">点击授权</button> ②、然后编写bindGetUserInfo函数: ...转载 2019-09-01 14:59:58 · 191 阅读 · 0 评论 -
支付宝支付的对接(支付宝小程序)
具体的一些链接:小程序支付接入:https://docs.alipay.com/mini/introduce/pay接口相关参数文档:https://docs.open.alipay.com/api_1/alipay.trade.create/生成RSA密钥工具:https://docs.open.alipay.com/291/105971/样式:一些前置工作在此不多...转载 2019-08-31 15:02:37 · 4659 阅读 · 0 评论 -
支付宝小程序初识
持续发酵的支付小程序(下文中直接以支付宝和微信指代支付宝小程序和微信小程序)在一拖再拖的情况下,终于在8月18日正式与大家见面,忍着可能是直接扒拉微信创意的一些让人不快的地方,去发现了下支付宝小程序的文档,来写一写东西与大家分享。进入支付宝的主界面是和微信一样上部搜索栏目可搜索小程序,下部是账号的小程序列表。点击进入某款小程序,体感上感觉支付宝要比微信略微吃顿,在使用时有稍许点击上的延迟以...转载 2019-08-31 14:53:27 · 130 阅读 · 0 评论 -
支付宝小程序使用扩展组件安装
1.刚开始按官网文档(https://docs.alipay.com/mini/component-ext/overview-ext-common)安装步骤:1.安装npm2.npm init -f3.安装npm installmini-antui --save转载 2019-08-31 14:51:44 · 1539 阅读 · 0 评论 -
支付宝小程序中使用npm包
如果小程序中是第一次使用npm,是没有package.json文件的,所以直接npm install --production就会告诉你,没有什么可安装的,就不会创建node_modules文件夹,所以一定要先npm init,初始化npm;第一步:在项目根目录下启动cmd输入命令:npminit第二步:直接在NPM包管理上搜索回车 安装比如axios...转载 2019-08-31 14:48:38 · 2928 阅读 · 0 评论 -
微信小程序实例-摇一摇抽奖
微信小程序目录为了更好的理解小程序和小程序开发,我们首先来看一下项目的目录。首先看下根目录下的app.json的文件,可以看到在”pages”的数组里,里面配置了每个界面,且包含了每个界面文件的目录我们接下来看一下page文件夹,可以看到每个页面需要包含两个文件,一个是js文件,是每个界面的入口,wxml的文件是每个界面的布局文件,wxss是样式文件。接下来看一下logs...转载 2019-08-31 14:35:00 · 2309 阅读 · 0 评论 -
微信小程序开发之大转盘 仿天猫超市抽奖
天猫超市翻牌的转盘经常用,以前做Android,没啥想法,现在尝试微信小程序,看到别人家APP里有啥好玩的,就想去做一个.上GIF看效果:效果分析:1.外面一圈闪烁的小球是用js控制的样式.500ms改变一次样式.简单粗暴;2.抽奖的item也是js控制背景,但是怎么样让它优雅的停下来是个问题.动画中有timingFunction可以设置速度.自己用js就没那么简单了.我这里用...转载 2019-08-31 14:26:39 · 191 阅读 · 0 评论 -
微信小程序npm安装第三方包AntV F2
AntV F2官网:https://antv.alipay.com/zh-cn…需要准备:微信开发工具(必须支持npm功能);node.js安装;npm基础知识;以下操作是node.js已经安装过了。1、先建好小程序模版。比如下图:然后使用dos命令打开这个当前的文件夹。比如下图:注意:dos命令打开的是小程序文件夹所放的路径。2、初始化指令如果...转载 2019-08-31 13:05:19 · 1661 阅读 · 0 评论 -
微信小程序使用npm安装第三方包miniprogram-datepicker
小程序现在支持直接通过npm安装包了,点击这里了解更多。记录一下我自己的安装步骤及安装过程中遇到的一些问题。希望能够帮助到正在阅读此篇文章的你~我就直接通过在项目根目录安装miniprogram-datepicker做演示了。1.在项目根目录下面新建文件夹:node_modules。2.终端进入到node_modules文件夹所在的目录(注意不是node_modules文件夹里面),在...转载 2019-08-31 11:45:05 · 6723 阅读 · 1 评论 -
支付宝小程序学习入门
支付宝小程序官方文档https://docs.alipay.com/mini/developer/getting-started第一步:首先,请下载小程序开发者工具(IDE)。它是一个辅助开发支付宝小程序的本地应用工具,包含本地调试、代码编辑、真机预览、发布等功能,覆盖了应用开发的完整流程。https://docs.alipay.com/mini/ide/download然后...转载 2019-09-01 18:28:51 · 594 阅读 · 0 评论