09 2020 档案

小程序开发-云函数开发中json解析
摘要：云函数开发中需要用到json数据中的解析 var resObj = JSON.parse(res); 使用JSON.parse方法可以把json字符串转成json对象，然后就可以访问对象属性了 阅读全文
posted @ 2020-09-28 16:59 小黎爱学习 阅读(472) 评论(0) 推荐(0)
小程序开发-iView app的NoticeBar 通告栏修改背景颜色
摘要：NoticeBar 通告栏 这是个比较好用的组件，具体使用方法见 http://inmap.talkingdata.com/wx/index_prod.html#/components/notice-bar 官方文档的属性列表： 需要注意的是实际使用时发现background-color这个属性设置 阅读全文
posted @ 2020-09-27 14:44 小黎爱学习 阅读(1372) 评论(0) 推荐(0)
小程序开发-自定义函数的方式
摘要：自定义函数 小程序开发我们会遇到需要定义函数的情况，如果没有正确定义函数，在调用时会出现‘not defined’ 的情况。 一般情况下我们有需要定义函数的几种情况 1. 在当前页面的js文件中直接定义和使用 这种情况需要注意的是应该在 page()在外部定义，然后在相关的生命周期函数中使用 如： 阅读全文
posted @ 2020-09-24 17:09 小黎爱学习 阅读(2492) 评论(0) 推荐(0)
小程序开发-iView Weapp的步骤条
摘要：iView Weapp的步骤条 这个步骤条真是个好组件，效果如下： 代码如下： <i-steps> <i-step status="finish" icon="barrage"> <view slot="title"> 已完成 </view> <view slot="content"> 这里是该步骤 阅读全文
posted @ 2020-09-21 17:15 小黎爱学习 阅读(1233) 评论(1) 推荐(0)
小程序开发-IView Weapp组件库List 列表的使用
摘要：IView Weapp List列表 1. 引入List组件 "usingComponents": { "i-cell-group": "../../dist/cell-group/index", "i-cell": "../../dist/cell/index" } 2. 在wxml中使用i-ce 阅读全文
posted @ 2020-09-16 17:00 小黎爱学习 阅读(1475) 评论(0) 推荐(0)
小程序开发-iView Weapp微信小程序UI组件库入门使用
摘要：iView Weapp UI组件库 今天来试试iView Weapp 这个微信小程序组件库，看看好不好用~~ 官网地址： http://inmap.talkingdata.com/wx/index_prod.html#/ 扫码观看地址见： 使用方法 从https://github.com/Talki 阅读全文
posted @ 2020-09-15 16:52 小黎爱学习 阅读(990) 评论(0) 推荐(0)
小程序开发-WeUI组件库使用
摘要：WeUI组件库简介 这是一套基于样式库weui-wxss开发的小程序扩展组件库，同微信原生视觉体验一致的UI组件库，由微信官方设计团队和小程序团队为微信小程序量身设计，令用户的使用感知更加统一。 1. 引入组件 推荐方式1， 可以省略后面import方式 方法1： 可以在app.json中通过引入扩 阅读全文
posted @ 2020-09-14 15:53 小黎爱学习 阅读(1134) 评论(0) 推荐(0)
小程序开发-6个优秀的UI组件库
摘要：微信小程序开发，当原生的控件不能满足我们时，可以尝试下面几个比较优秀的组件库。 1. WeUI WXSS WeUI WXSS是腾讯官方UI组件库WeUI的小程序版，提供了跟微信界面风格一致的用户体验。 GitHub地址：https://github.com/Tencent/weui-wxss 2. 阅读全文
posted @ 2020-09-14 15:36 小黎爱学习 阅读(1699) 评论(0) 推荐(0)
小程序开发-后台播放音乐方式
摘要：小程序后台播放音乐 如果需要在小程序切入后台继续播放音频，需要在app.json 中配置 requiredBackgroundModes 属性 "requiredBackgroundModes": [ "audio" ] 配置如下： 播放音乐 playBgAudio: function () { l 阅读全文
posted @ 2020-09-10 15:02 小黎爱学习 阅读(1553) 评论(0) 推荐(1)
小程序开发-好看的登录样式
摘要：在学习小程序的demo中看到一个挺漂亮的登录页面样式 先保存下来，后面有需要的时候用... 主要代码 login.wxml: <form class="login-form"> <view class="input-group {{userid_focus ? 'active' : ''}}"> < 阅读全文
posted @ 2020-09-09 16:18 小黎爱学习 阅读(2820) 评论(0) 推荐(0)
小程序开发-本地缓存使用方式
摘要：小程序本地缓存Api 异步 1. wx.setStorage(Object object) 将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容 wx.setStorage({ key:"key", data:"value" }) 2. wx.getStorage(Objec 阅读全文
posted @ 2020-09-09 15:37 小黎爱学习 阅读(404) 评论(0) 推荐(0)
小程序开发-小程序页面间传递数据的方式
摘要：在小程序开发中，我们小程序的不同页面间经常需要传递一些数据。针对不同的数据要求，有几种不同的传递数据方式。 1. 页面跳转通过url传递数据 在使用wx.navigateTo或者wx.redirectTo的时候，可以将部分数据放在url里面，在新页面onLoad的时候获取且初始化。 //pageA. 阅读全文
posted @ 2020-09-09 15:20 小黎爱学习 阅读(1124) 评论(0) 推荐(1)
小程序开发-使用Loading和Toast提示框
摘要：小程序提示框 Loading提示框使用方式 1. 在wxml中作为组件使用 <loading hidden="{{hidden}}"> 加载中... </loading> 通过设置hidden的值来控制Loading提示框的显示和隐藏 2. 在js中调用对应方法 显示： wx.showLoading 阅读全文
posted @ 2020-09-08 15:53 小黎爱学习 阅读(1288) 评论(0) 推荐(0)
小程序开发-开发入门总结
摘要：1. 注意点 App() 必须在 app.js 中注册，且不能注册多个。 编译后的代码包大小需小于 1MB，否则代码包将上传失败。 每个页面需要手动在app.json中进行注册，否则不能访问。 app.json中pages数组的第一项代表小程序的初始页面，小程序中新增/减少页面，都需要对 pages 阅读全文
posted @ 2020-09-08 14:21 小黎爱学习 阅读(188) 评论(0) 推荐(0)
小程序开发-自定义顶部底部导航栏和全屏导航栏
摘要：顶部导航栏 1. 设置导航栏文字 在相应界面的json中加入属性值： "navigationBarTitleText":"自定义文字", "navigationBarTextStyle":"white" 2. 设置导航栏颜色 在相应界面的Json 文件中加入属性、值，值只能是十六进制的颜色。 "na 阅读全文
posted @ 2020-09-08 14:04 小黎爱学习 阅读(558) 评论(0) 推荐(0)
小程序开发-如何定制启动首页
摘要：小程序首页 一般情况下我们是在app.json中的pages里面定义好小程序的所有页面。 { "pages": ["pages/index/index", "pages/logs/logs"] } 开发目录结构为： ├── app.js ├── app.json ├── app.wxss ├── p 阅读全文
posted @ 2020-09-07 17:11 小黎爱学习 阅读(379) 评论(0) 推荐(0)
小程序开发-自定义导航栏组件
摘要：上一篇文章讲到了小程序设置全屏，隐藏导航栏的方式。 主要是配置自定义导航栏"navigationStyle": "custom" 这篇文章尝试自定义导航栏 1. 首先，我们要获取状态栏的高度，以及胶囊的位置 可以通过getSystemInfo 方法 //获取菜单按钮(右上角胶囊按钮)的布局位置信息 阅读全文
posted @ 2020-09-07 14:47 小黎爱学习 阅读(286) 评论(0) 推荐(0)
小程序开发-小程序设置全屏，禁用默认的导航栏
摘要：小程序设置全屏 从微信小程序开发文档中没有找到设置全屏的方式。 但是在[小程序页面配置]（https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html），我们可以看到只有自定义导航栏的方式。 当我 阅读全文
posted @ 2020-09-07 14:13 小黎爱学习 阅读(1255) 评论(0) 推荐(0)
小程序开发-页面导航栏navigation-bar组件
摘要：导航栏navigation-bar 页面导航条配置节点，用于指定导航栏的一些属性。只能是 page-meta 组件内的第一个节点，需要配合它一同使用。 通过这个节点可以获得类似于调用 wx.setNavigationBarTitle wx.setNavigationBarColor 等接口调用的效果 阅读全文
posted @ 2020-09-05 14:37 小黎爱学习 阅读(1515) 评论(0) 推荐(0)
小程序开发-Canvas画布组件
摘要：Canvas画布 基本使用方法： 在wxml中添加canvas组件 <canvas canvas-id='canvasDemo' class='demo'></canvas> // canvas-id：必须填写 在对应js中执行绘画具体逻辑 // canvas.js Page({ onReady() 阅读全文
posted @ 2020-09-05 14:05 小黎爱学习 阅读(420) 评论(0) 推荐(0)
小程序开发-Map地图组件
摘要：Map组件 是原生组件，使用时请注意相关限制。个性化地图能力可在小程序后台“设置-开发者工具-腾讯位置服务”申请开通。 设置subkey后，小程序内的地图组件均会使用该底图效果，底图场景的切换会在后续版本提供。 详见《小程序个性地图使用指南》 官方文档地址 https://developers.we 阅读全文
posted @ 2020-09-05 13:47 小黎爱学习 阅读(1817) 评论(0) 推荐(0)
小程序开发-媒体组件video使用入门
摘要：video 视频（v2.4.0 起支持同层渲染）。相关api：wx.createVideoContext 常见属性如下： 支持的格式 示例： <video src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280 阅读全文
posted @ 2020-09-04 14:27 小黎爱学习 阅读(433) 评论(0) 推荐(0)
小程序开发-媒体组件image
摘要：image 图片组件，支持 JPG、PNG、SVG、WEBP、GIF 等格式，2.3.0 起支持云文件ID. 所有属性如下： Tips image组件默认宽度320px、高度240px image组件中二维码/小程序码图片不支持长按识别。仅在wx.previewImage中支持长按识别 <image 阅读全文
posted @ 2020-09-04 14:21 小黎爱学习 阅读(208) 评论(0) 推荐(0)
小程序开发-组件navigator导航篇
摘要：navigator 页面链接 navigator的open-type属性 可选值 navigate、redirect、switchTab，对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能 open-type="navigate"等价于 API 的　wx.n 阅读全文
posted @ 2020-09-04 14:14 小黎爱学习 阅读(279) 评论(0) 推荐(0)
小程序开发-表单组件的使用
摘要：表单组件 所有组件的列表可以在官方文档 找到 1. Button 重要属性如下： size 合法值 default[默认大小]， mini [小尺寸] type 合法值 primary[绿色]， default[白色]， warn [红色] loading 名称前是否带 loading 图标 2. 阅读全文
posted @ 2020-09-04 14:07 小黎爱学习 阅读(343) 评论(0) 推荐(0)
小程序开发-视图容器入门
摘要：小程序的基础组件——视图容器 1. view 基本上用来包裹其他组件 <view class="section"> <view class="section__title">flex-direction: row</view> <view class="flex-wrp" style="flex-d 阅读全文
posted @ 2020-09-03 18:59 小黎爱学习 阅读(227) 评论(0) 推荐(0)
小程序开发-基础组件icon/text/progress入门
摘要：小程序的基础组件——基础内容 基础内容分为三大组件: 1. icon——图标 index.wxml <view class="group"> <block wx:for="{{iconSize}}"> <icon type="success" size="{{item}}"/> </block> < 阅读全文
posted @ 2020-09-03 18:51 小黎爱学习 阅读(254) 评论(0) 推荐(0)
小程序开发-block组件的使用
摘要：微信小程序中，block不是一个组件，而是一个包装元素，不会在页面中做任何渲染。 使用情况：条件渲染 wx:if 因为 wx:if 是一个控制属性，需要将它添加到一个标签/组件上，用于控制隐藏与显示。而如果需要一次性控制多个组件的隐藏与显示，一个一个添加wx:if过于繁琐，此时就可以使用block将 阅读全文
posted @ 2020-09-03 18:42 小黎爱学习 阅读(617) 评论(0) 推荐(0)
小程序开发-小程序tabBar不显示的原因分析
摘要：在尝试小程序开发时，tabBar这个是个非常常见的组件，但是今天在进行开发时，设置了TabBarb并没有显示，被这个问题困扰了近半小时，现在将排查问题后所得到的经验记录下来。 首先 如果tabBar不显示，要排查所指向的页面是否进行了页面注册。如果没有注册的话，页面是找不到的。 其次 要确保路径的拼 阅读全文
posted @ 2020-09-02 16:30 小黎爱学习 阅读(1235) 评论(0) 推荐(0)
小程序开发-如何使用全局变量
摘要：全局变量的设置 在miniprogram > app.js 文件中设置，globalData对象就是存储全局变量的。 App({ globalData: { hasLogin: false, openid: null }, onLaunch: function () { } }) 2.全局变量的使用 阅读全文
posted @ 2020-09-02 16:28 小黎爱学习 阅读(294) 评论(0) 推荐(0)
小程序开发-微信小程序开发入门
摘要：分享一个微信小程序开发的基本流程，仅供参考。 第一步：注册微信小程序公众号，注册成功后，登录微信公众号管理后台，等待下一步操作。 第二步：进入微信小程序的后台后，下载微信内置的微信小程序开发者工具，以及进行其它的一些开发设置。 （1）打开微信web开发工具，扫码进入开发者工具主页面； （2）在手机上 阅读全文
posted @ 2020-09-02 16:18 小黎爱学习 阅读(218) 评论(0) 推荐(0)
小程序开发-开发模式下关闭http域名校验
摘要：小程序开发模式去掉域名校验 我们在开发小程序的时候如果用到其他网络地址，在小程序运行时调试器会输出 : http://www.example.com 不在以下 request 合法域名列表中，请参考文档：https://developers.weixin.qq.com/miniprogram/dev 阅读全文
posted @ 2020-09-01 14:31 小黎爱学习 阅读(999) 评论(0) 推荐(0)
小程序开发-使用xpath解析网页html中的数据
摘要：最新有个微信小程序的开发需求，需要从网页中提取一些元素信息，获取有效数据 1. 了解到微信小程序里面不能直接操作dom元素，所以我们需要使用一些其他的npm包 2. 经过查到各方面的文档，最新决定用xpath来实现对应功能 先安装对应的npm包，安装步骤见上一篇文章 小程序使用npm包 我们安装了如 阅读全文
posted @ 2020-09-01 14:25 小黎爱学习 阅读(635) 评论(0) 推荐(0)
小程序开发-使用npm包
摘要：微信小程序引用npm包 微信小程序官方支持使用npm包，地址为 https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html 实际上我们创建的小程序模板中没有 package.json , 导致开发者工具中的 构建npm 执行操 阅读全文
posted @ 2020-09-01 10:55 小黎爱学习 阅读(317) 评论(0) 推荐(0)