随笔分类 -  小程序

青柠味的微信小程序~
【小程序】---- 实现搜索功能
摘要：一、功能描述： 在小程序中实现从列表页跳转到搜索页做模糊查询，要求在展示的搜索结果中，与输入框所输入的内容一致的部分要标红。 二、解决思路： 引入 vant 的搜索组件，使用 parser 微信小程序富文本插件解析<style>标签中的全局样式。 // json文件 "usingComponents 阅读全文
posted @ 2020-09-14 16:44 ONE橙子 阅读(2366) 评论(0) 推荐(0)
【小程序】---- 页面间通信接口，跳转页面携带参数
摘要：一、功能描述： 在 2019 年 7 月 2 日的小程序基础库版本更新 v2.7.3 中，小程序新增了一个页面间通讯的接口，帮助我们的小程序完成不同页面间数据同步的功能。 二、实现方式： 假设页面 A 打开详情页面 B 1. A 向 B 传递数据 // A页面 wx.navigateTo({ url 阅读全文
posted @ 2020-09-14 16:35 ONE橙子 阅读(684) 评论(0) 推荐(0)
【小程序】--- 嵌套H5
摘要：一、小程序嵌套H5的方式 // 使用小程序提供的 web-view 标签 <web-view src="https://{{url}}"></web-view>// 注：<web-view>不支持个人小程序账号和海外的小程序账号; // 使用 <web-view> 标签能在小程序中打开外部网页，但是 阅读全文
posted @ 2020-09-14 16:33 ONE橙子 阅读(910) 评论(0) 推荐(0)
【小程序】---- getCurrentPages()的使用，返回上一页传递数值
摘要：一、功能描述： getCurrentPages() 函数用于获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。 二、注意要点： 1. 不要尝试修改页面栈，会导致路由以及页面状态错误。2. 不要在 App.onLaunch 的时候调用 getCurrentPag 阅读全文
posted @ 2020-09-14 14:50 ONE橙子 阅读(1281) 评论(0) 推荐(0)
【小程序】---- 封装Echarts公共组件，遍历图表实现多个饼图
摘要：一、问题描述： 在小程序的项目中，封装公共的饼图组件，并在需要的页面引入使用。要求一个页面中有多个饼图，动态渲染不同的数据。 二、效果实现： 1. 查看——小程序使用Echarts的方式 2. 封装饼图公共组件 // pie.wxml <view class="containers"> <ec-ca 阅读全文
posted @ 2020-09-14 10:40 ONE橙子 阅读(2106) 评论(0) 推荐(0)
【小程序】---- 使用 Echarts 的方式
摘要：1、下载 GitHub 上的 ecomfe/echarts-for-weixin 项目，Echarts微信版。 地址：https://github.com/ecomfe/echarts-for-weixin 2、将 ec-canvas 文件放置到小程序项目中 3、使用echarts(饼图为例) // 阅读全文
posted @ 2020-09-11 17:37 ONE橙子 阅读(915) 评论(0) 推荐(0)
【小程序】---- 使用 Vant 的方式
摘要：1、在项目根目录初始化：npm init 2、根据 vant官网 安装教程：npm i @vant/weapp -S --production 3、微信开发者工具 - 工具 - 构建npm 【新版】 4、微信开发者工具 - 详情 - 本地设置 - 勾选 “使用npm模块” 5、vant 的使用 // 阅读全文
posted @ 2020-09-11 16:39 ONE橙子 阅读(507) 评论(0) 推荐(0)
【小程序】---- 实现授权与登录的基本流程
摘要：1、点击登录按钮进行授权 <button open-type="getUserInfo" bindgetuserinfo="onGotUserInfo"> 2、允许授权后进行登录 // 授权 onGotUserInfo(e) { // 允许授权后能获取到微信昵称、头像，以及iv、encryptedD 阅读全文
posted @ 2020-09-11 16:03 ONE橙子 阅读(739) 评论(0) 推荐(0)
【小程序】---- 封装请求
摘要：// 不需要 token 的请求头 var headerWithoutJwt = { 'content-type': 'application/json', // 默认值 'x-request-from': 'wechat_applet' } // 当路径中带有以下字段时不添加 token var 阅读全文
posted @ 2020-09-11 15:57 ONE橙子 阅读(256) 评论(0) 推荐(0)
【小程序】---- 自定义数字键盘拨号
摘要：一、问题描述 项目要求在小程序中实现像手机拨打电话一样得拨号键盘，点击拨打后跳转到手机默认拨号界面，并通过虚拟小号进行拨打。 二、页面效果 三、代码实现 // wxml<view> <view class="input-box">{{tel}}</view> <view class="keyboar 阅读全文
posted @ 2020-09-11 15:17 ONE橙子 阅读(1644) 评论(0) 推荐(0)
【小程序】---- input中密码的明文密文转换
摘要：问题关于小程序input输入框中的密码可见与不可见的具体实现。 思路原理：小程序 input 的密码类型由 “password” 属性控制，为 true 时是小圆点密码类型不可见，为 false 时是普通text类型可见。操作：将显示隐藏控制图标定位到输入框上，通过图标的点击事件，控制 input 阅读全文
posted @ 2020-03-15 11:32 ONE橙子 阅读(2208) 评论(0) 推荐(0)
【小程序】---- input获得焦点时placeholder重影BUG
摘要：问题小程序的input组件有个自身的bug，即当输入框获取焦点时placeholder内容会出现重影现象。 解决思路原理：将placeholder内容单独写在另外的标签里，控制其显示隐藏。操作：将代表placeholder内容的标签定位到input框上，在input输入事件中控制标签隐藏，在inpu 阅读全文
posted @ 2020-03-14 15:57 ONE橙子 阅读(1521) 评论(0) 推荐(0)
【小程序】---- 基础知识汇总
摘要：一、基本问题 1、生命周期 （1）全局 onLaunch：初始化完成时 onShow：小程序启动或从后台进入前台显示时 onHide：小程序隐藏，从前台进入后台时 onError：小程序发生脚本错误，或api调用失败时触发，会带上错误信息 onPageNotFound：小程序要打开的页面不存在时触发 阅读全文
posted @ 2020-03-14 14:06 ONE橙子 阅读(736) 评论(0) 推荐(0)