![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序以及公众号
城南花开ze
技术不止
展开
-
微信小程序的视图层总结
一、微信小程序的WXML语法数据绑定将 data 中的变量用大括号进行包裹起来,{{}},类似插值表达式,如 {{ message}}列表渲染列表渲染通过wx:for指令可以对data数据进行渲染,渲染时加上wx:key,进行唯一标识,通过wx:for-item可以指定数组当前元素的变量名,通过wx:for-index可以指定数组当前下标的变量名,代码示例如下 <view wx:for="{{ items }}" wx:key="{{ index }}"> {{ item原创 2020-11-14 00:43:48 · 958 阅读 · 0 评论 -
微信小程序的逻辑层总结
一、全局配置文件 App.jsonLaunch(Object object) 小程序初始化完成时触发,全局只触发一次,生命周期回调—监听小程序初始化onShow(Object object)小程序启动,或从后台进入前台显示时触发,生命周期回调-监听小程序启动或切前台onHide()小程序从前台进入后台时触发,生命周期回调—监听小程序切后台onError(String error)小程序发生脚本错误或 API 调用报错时触发onPageNotFound(Object object)小程序要原创 2020-11-13 00:23:47 · 573 阅读 · 0 评论 -
微信小程序基础知识总结
一、页面文件小程序中的页面文件分为四个,index.wxml、index.wxss、index.js和 index.jsonindex.wxml 是布局文件,index.wxss 是样式文件,index.js 是逻辑文件, index.json 是配置文件页面级别的配置会覆盖全局级别的配置小程序全局通用配置文件只有 app.wxss、app.js和app.json文件,app.wxml文件没有小程序页面级别配置文件有index.js、index.json、index.wxml和index.wxs原创 2020-11-12 00:49:12 · 1607 阅读 · 0 评论 -
微信公众号开发如何获取 access_token
一、微信公众号获取 access_tokenaccess_token 是微信调用接口全局唯一的凭据。它的特点是唯一的,有效期为2 小时,提前 5分钟请求,接口权限,每天 2000 次。它的请求地址是 https请求方式: GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APP...原创 2020-05-04 09:35:32 · 2788 阅读 · 1 评论 -
微信公众号开发如何验证服务器消息的有效性
一、微信公众号验证服务器消息有效性验证服务器的有效性,需要微信服务器知道开发者服务器是哪个,也需要开发者服务器 验证消息是否来自微信服务器。对于微信服务器知道开发者服务器是哪个,可以在测试号管理页面上填写 url 开发者服务器地址,以及填写token,token 参与微信签名加密的一个参数。对于开发者服务器 验证消息是否来自微信服务器,目的是计算得出 signature 微信加密...原创 2020-05-03 20:58:55 · 740 阅读 · 1 评论 -
微信小程序如何开发购物车的微信支付功能
一、微信小程序购物车的支付功能准备一些需要的支付配置信息,小程序 appid、微信商户号和商户密匙,如下所示:微信认证-注册一个微信支付的商户号https://pay.weixin.qq.com/index.php/core/home/login?return_url=%2Findex.php%2F生成微信支付的秘钥https://www.jianshu.com/p/f080...原创 2020-05-03 13:34:01 · 2039 阅读 · 1 评论 -
微信小程序如何实现购物车功能
一、微信小程序的购物车功能在商品列表页 index.wxml 中,给下单按钮绑定一个添加购物车的事件 addCart,使用 catchtap 是不会冒泡,同时传入 data-item,当前的商品,代码如下所示: <view class="order" catchtap="addCart" data-item="{{ item }}">下单</view>...原创 2020-05-02 21:12:00 · 13662 阅读 · 6 评论 -
微信小程序云开发中的云数据库
一、云数据库的说明提供增删改查能力的mongoDB数据库 , 是一个非关系型数据库, 是以文档对象存在的数据库 >> 集合(数组) >> 文档(对象)二、可视化操作数据库创建两个集合添加两条记录name : 张三, age:18, desc : 这是一个好学生name : 李四, age:19, desc : 这是一个坏学生导入数据准...原创 2020-05-02 16:08:18 · 2863 阅读 · 0 评论 -
微信小程序云开发中的云函数和云存储
一、微信小程序的云函数云函数文件的创建创建文件夹 cloudfunction/在项目根目录找到 project.config.json 文件,新增 cloudfunctionRoot 字段,指定本地已存在的目录作为云函数的本地根目录"cloudfunctionRoot" : "./cloudfunction"右键 选择环境云函数的创建和使用右键创建一...原创 2020-05-02 15:58:36 · 2560 阅读 · 0 评论 -
微信小程序的云开发以及与传统开发的比较
一、微信小程序的云开发概念云开发就是一套解决小程序前后端开发的一种云端能力它提供了一整套云服务及简单、易用的 API 和管理界面,以尽可能降低后端开发成本,让开发者能够专注于核心业务逻辑的开发、尽可能轻松的完成后端的操作和管理云开发包含了小程序前端和小程序后端二、云开发和传统开发的区别传统开发:云开发:使用传统开发的优缺点:优点 : 我们不用管后台逻辑, 直接...原创 2020-05-02 15:49:33 · 21325 阅读 · 6 评论 -
前端面试之微信小程序常见问题总结
一、简单描述下微信小程序的相关文件类型1. 微信小程序项目结构主要有四个文件类型WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件、事件系统,可以构建出页面的结构。内部主要是微信自己定义的一套组件WXSS (WeiXin Style Sheets)是一套样式语言,用于描述WXML 的组件样式-js逻辑处理,网络请求json 小程序设...原创 2020-03-15 00:23:08 · 1441 阅读 · 0 评论 -
微信小程序如何实现列表数据的详情页功能
微信小程序点击列表页进入详情页,在列表页 list.wxml中,对于每一个数据项,可以通过 catchtap去绑定一个事件,去详情页的事件 toDetail。 对于详情页的传输数据,点击事件可以通过 data- 去实现,后面相当于是键值对,data-index="{{index}}",意思是传输的值的名字叫index,值为 index,代码如下:<block wx:for="{{li...原创 2020-03-13 00:10:53 · 8740 阅读 · 0 评论 -
微信小程序如何进行登录授权和获取用户信息
在 index.wxml 点击的 button 按钮中,去进行判断和获取。在button中,设置 open-type 的值 为 getUserInfo, open-type 是微信的开放能力,getUserInfo可以 获取用户信息和可以从bindgetuserinfo回调中获取到用户信息。给 button去绑定 bindgetuserinfo , bindgetuserinfo 去绑定 h...原创 2020-03-11 23:02:36 · 4925 阅读 · 0 评论 -
Cannot read property 'apply' of null;at pages/detail/main page onShareAppMessage function
一、在之前进行mpvue开发微信小程序的时候,设置转发的时候,遇到了这个问题,Cannot read property 'apply' of null;at pages/detail/main page onShareAppMessage function TypeError: Cannot read property 'apply' of null,如图所示:二、这个问题说明了无法读取空的属...原创 2020-03-01 23:21:39 · 816 阅读 · 0 评论 -
微信小程序如何引入iconfont
在阿里巴巴矢量库官网上将项目所需要用到的图标建立好,在我的项目中会有一个在线链接,点击复制代码,将在线链接的地址复制下来,放在浏览器的官网上打开,会出现相应的样式代码,将代码全部复制下来,如图所示:在style 文件夹下建立一个iconfont文件夹,在里面建立一个iconfont.wxss文件,将之前在浏览器复制的代码全部放在这个文件里面,如图所示:在app.wxss文件中去引入这个...原创 2020-01-21 14:33:48 · 2381 阅读 · 0 评论 -
cloud init error: Error: invalid scope 没有权限,请先开通云服务
一、在之前使用微信开发者工具进行微信开发的时候,使用云函数开发的时候,遇到了这个问题。 cloud init error: Error: invalid scope 没有权限,请先开通云服务,如图所示:二、这个问题说明了没有云函数开发的权限,需要进行云函数的配置,点击上方的云开发按钮,进行基础数据配置,以及名字相关的配置,配置完以后就可以解决了,如图所示:...原创 2020-01-21 12:38:16 · 22129 阅读 · 9 评论 -
微信小程序如何实现搜索功能
在页面search.wxml中,定义一个input输入框以及搜索的点击按钮,分别为它们绑定点击事件handleInputChange()和handleSearch()的事件,同时在它们的下面定义搜索的列表,代码如下所示:<view class="search-header"> <input class="search-input" bindtap="handleInp...原创 2020-01-17 11:21:04 · 15864 阅读 · 1 评论 -
微信小程序如何实现点击后地图选择定位位置
在需要进行点击的页面中,location.wxml,写上点击事件,以及绑定的数据,代码如下所示:<view class="content" bindtap="handleAddressClick">{{ address }}</view>在相应的js文件中,location.js,在data中,定义之前绑定的数据,address,给上一个默认初始值,代码如下所示...原创 2020-01-15 21:36:14 · 5852 阅读 · 0 评论 -
微信小程序如何实现点击地图控件后位置移动到当前的定位点
在index.js中使用地图,使用controls控件和show-locatio展示带有方向的当前定位点,以及bindcontroltap绑定点击事件,代码如下所示:<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" class="map" show-location controls="...原创 2020-01-14 17:29:46 · 5063 阅读 · 0 评论 -
微信小程序如何使用地图开发获取位置信息
在app.json中开发小程序的接口权限,设置permission的权限,在里面配置scope.userLocation,开放位置权限,代码如下所示:"permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的展示" } },在页面indx.wxml中,调用map的信息,代码如下所...原创 2020-01-13 21:24:21 · 1425 阅读 · 0 评论 -
微信小程序的生命周期
一、全局配置文件的生命周期onLaunch()生命周期回调—监听小程序初始化,小程序初始化完成时触发,全局只触发一次onShow()生命周期回调-监听小程序启动或切前台,小程序启动,或从后台进入前台显示时触发onHide()生命周期回调—监听小程序切后台,小程序从前台进入后台时触发二、 页面配置文件的生命周期onLoad()生命周期回调—监听页面加载,页面加载时触发,一个页...原创 2020-01-13 14:59:47 · 200 阅读 · 0 评论