![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
yaoxinsong
我正在运用自己的思维,以最简单的代码组装强大的功能。之所以做笔记是因为学的东西太多,不怎么用的东西太长时间不用就忘了。
展开
-
微信小程序JSAPI支付
一、准备资料1、需要注册一个微信商户平台https://pay.weixin.qq.com/(主要是需要mch_id(微信支付商户号)商户Key(其实就是API密钥)2、申请一个微信小程序账号(需要有微信支付、微信认证) (主要是需要appid、AppSecret(小程序密钥))二、操作流程(https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=3建议多多看看操作流程图,之前就是因为,没注..原创 2020-09-17 15:25:46 · 3852 阅读 · 0 评论 -
微信小程序上传图片(wx.chooseImage和wx.uploadFile)
util.jsconst TOKENNAME = 'Authori-zation';/** 单图上传* @param object opt* @param callable successCallback 成功执行方法 data * @param callable errorCallback 失败执行方法 */const uploadImageOne=function (opt, successCallback, errorCallback) { let count = opt..原创 2020-08-27 14:54:22 · 1199 阅读 · 0 评论 -
微信小程序封装wx.request接口调用
1、判断登录是否过期(主要判断token、有效时间、是否登录的状态)2、过期操作的流程获取cache_key缓存 执行成功的回调 (1)在用户授权成功的情况下调用wx.getUserInfo (2)将用户信息作为参数调用后端的登录接口,执行登录成功的回调重新保存token、userinfo、expiresTime(有效时间)、缓存wx.setStorage({key:'cache_key',data:res.data.cache_key})config....原创 2020-08-27 10:56:10 · 830 阅读 · 1 评论 -
微信小程序-发送给朋友
https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html设置分享状态小程序页面默认不可被分享到朋友圈,开发者需主动设置“分享到朋友圈”。页面允许被分享到朋友圈,需满足两个条件:首先,页面需设置允许“发送给朋友”。具体参考Page.onShareAppMessage接口文档 满足条件 1 后,页面需设置允许“分享到朋友圈”,同时可自定义标题、分享图等。具体参考Pag...原创 2020-08-22 11:52:23 · 3847 阅读 · 0 评论 -
微信小程序使用swiper和scroll-view做Tab标签页
说白了,就是利用轮播图的特性做Tab标签页Page({ data: { //顶部安全距离(状态栏高度) statusBarHeight: wx.getSystemInfoSync().statusBarHeight, navScrollLeft: 0, currentTab: 0, navData: [ { text: 'A' }, { text: 'B' }, {原创 2020-07-28 09:12:57 · 472 阅读 · 0 评论 -
微信小程序双向数据绑定的方法
<!-- miniprogram\pages\index\index.wxml --><view class="login" style="margin-top:{{statusBarHeight}}px;padding-top:44px"> <input class="login_phone" placeholder-class="phcolor" type="text" placeholder="输入字符串" bindinput="updateValue" data.原创 2020-07-24 15:36:19 · 385 阅读 · 0 评论 -
微信小程序flex布局列表数据展现
page{ background-color: #fff; }.top-bg{ margin: 0; padding: 0; width: 100%; height: 20rpx; background-color: #F2F2F2;}.box-list{ margin-top: 20rpx;}.box-list .box-title-row{ display: flex; font-size: 14px; line-height: 42px;...原创 2020-07-23 17:46:45 · 965 阅读 · 0 评论 -
微信小程序switch组件样式调整
<switch color="#FDA424" checked="{{switchChecked}}" bindchange="switchChange"/>方法1:css样式调整.wx-switch-input{ width:82rpx !important; height:40rpx !important;}.wx-switch-input::before{ width:80rpx !important; height: 36rpx !important;}.原创 2020-07-23 13:49:53 · 821 阅读 · 0 评论 -
微信小程序顶部导航栏刘海屏的横线问题
{ "pages": [ "pages/index/index" ], "window": { "backgroundColor": "#F6F6F6", "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#f2615b", "navigationBarTitleText": "云开发 QuickStart", "navigationBarTextStyle": "b.原创 2020-07-21 17:57:20 · 3235 阅读 · 1 评论 -
微信小程序tabBar导航栏示例
{ "pages": [ "pages/index/index", "pages/article_list/article_list", "pages/article_details/article_details", "pages/store/store", "pages/coupon/coupon", "pages/order/order", "pages/coach/coach", "pages/mine/mine", "p.原创 2020-07-20 17:57:56 · 526 阅读 · 0 评论 -
微信小程序子组件调用父组件的方法
1、创建组件// components/atest_view/atest_view.jsComponent({ /** * 组件的方法列表 */ methods: { parentComponentFunction: function(){ this.triggerEvent('parentComponentFunction'); } }})<!--components/atest_view/atest_view.wxml-->原创 2020-07-17 17:53:16 · 3980 阅读 · 0 评论 -
微信小程序创建组件
1、在component文件夹下创建组件的文件夹并在该文件夹下创建组件(一般微信开发者工具 右键 >> 新建Component)2、编写相关的js、wxml、wxss代码// components/coach_order_item/coach_order_item.jsComponent({ /** * 组件的属性列表 */ properties: { orderInfoList: { type: Array, value: [原创 2020-07-16 17:44:27 · 2315 阅读 · 0 评论 -
微信小程序wx.navigateBack返回上一页携带参数的方法
1、新建页面abctest1<view> <view bindtap="gotoAbctest2">点击进入abctest2页面</view> <view>接收返回页面的参数:{{parameterTest}}</view></view>Page({ /** * 页面的初始数据 */ data: { parameterTest: '' }, onLoad: function(原创 2020-07-15 17:52:22 · 1424 阅读 · 0 评论