小程序
一键写代码
这个作者很懒,什么都没留下…
展开
-
关于wepy2中开启小程序分享朋友圈的功能。
如何在wepy2开发的小程序中开启朋友圈分享小程序功能1、说明分享朋友圈功能暂时只支持安卓,并且输入beta版本。一句话,并不是很成熟。但是, 有时候,产品就是需要。2、官网文档https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html看文档: 当前页面,需要先开启发送朋友功能后,才能进一步分享到盆友圈功能。对应的api文档如下:3、实操在我们的页面中,method原创 2022-03-21 13:36:27 · 678 阅读 · 1 评论 -
小程序公共上传方法
// 七牛云上传多张图片 默认上传图片 type = 1 视频 qiniuToUpload(type, callFn){ let that = this that.request('get', '/shifu/index/api_upload_qiniu_get_token', {}, function (res) { if (res.error_code == 0) { that.globalData.upload_host = res.data.uplo.原创 2021-10-25 16:41:30 · 148 阅读 · 0 评论 -
app中使用企业微信sdk分享小程序报错:小程序路径错误,加载超时 解决办法。
问题描述:在app中,需要调用企业微信skd,分享小程序给客户,客户打开小程序。如果客户直接是企业微信中的,可以在企业微信中打开小程序。但是,如果客户是微信中,用户在微信中打开小程序就报错。ios分享出去可以,安卓分享就不行。app开发甩锅小程序问题。小程序打不开,肯定是小程序的问题。这个锅我们不接。甩锅是官方bug,这个不是解决办法。排查原因。我们查官方文档:小程序类型分享示例WWMediaMiniProgram miniProgram = new WWMediaMiniProgr原创 2021-09-24 10:47:16 · 1788 阅读 · 0 评论 -
wepy2中使用腾讯地图map组件bindregionchange无法绑定的解决办法
小程序官方文档:map组件支持的属性和事件:bindregionchange eventhandle 否 视野发生变化时触发, 2.3.0然而,大坑的是,在wepy2框架中,我们这样使用: <map class="map" id="map" controls="true" :longitude="longitude" :latitude="latitude" scale="15" :sub原创 2021-09-18 17:08:28 · 359 阅读 · 0 评论 -
九宫格抽奖小程序开发
实现效果:wepy2小程序代码<style lang="less" scoped>.draw_box { // position: relative; // width: 600rpx; // height: 600rpx; width: 600rpx; height: 600rpx; display: flex; justify-items: center; margin: 0 auto; background-repeat: no-repeat;原创 2021-08-10 16:36:55 · 761 阅读 · 0 评论 -
ios上同时使用transform和border-radius时,border-radius会失效的问题
在ios小程序开发时发现。同时使用transform 和border-radius属性是 border-radius会失效。解决办法:方法1、 不同时使用方法2、在使用动画效果带transform的元素的上一级div元素的css加上下面语句-webkit-transform:rotate(0deg);...原创 2021-07-22 11:51:19 · 581 阅读 · 0 评论 -
微信小程序使用wx.setNavigationBarTitle动态设置页码title在页面跳转时会有bug问题解决
这个问题出现的原因是,我的A页面的title是需要请求后台接口后才能设置的,请求接口是一个异步请求,这个请求发出后,里面跳转到另外一个页面B,已经发出的异步请求,并没有停止,而是等返回后执行wx.setNavigationBarTitle。这样就把B页面的titile给设置了。解决办法:我的是在A页面异步请求返回一个xx名称后,再将页面A的标题设置为xx名称。data:{tName:''},watch: { tName(curVal, oldVal) { var pages原创 2021-07-22 11:21:20 · 1425 阅读 · 0 评论 -
微信小程序使用日历需要禁用某些日期需求的实现
需求描述:日历组件,某些日期被人选了,就不能再选,用一个颜色标记。用户可以选择部分能选的。类似这样的需求图片。最简单的办法是,vant-ui 微信小程序插件 本身的日期组件是可以实现的。具体方法: <van-calendar title="日历" :show="true" :formatter="formatter1" color="#07c160" type="range" :show-confirm="false"/>原创 2021-07-07 14:07:15 · 2538 阅读 · 5 评论 -
wepy和wepy2中正确调用this.selectComponent()方法
我们知道,在原生小程序写法中,可以this.selectComponent()来获取子组件。但是在wepy中,this是包装过的对象了,无法直接调用原生api。在wepy1.x中调用:this.$wxpage.selectComponent()在wepy2.x中调用his.$wx.selectComponent('选择器')具体可以打印出this查看,一目了然。...原创 2021-07-07 11:55:15 · 953 阅读 · 0 评论 -
微信小程序自定义修改轮播图swiper指示器的样式
默认的小程序轮播图组件样式是圆点点。有时候UI需要改指示器的样式使用: <swiper :autoplay="false" :indicator-dots="true"> <swiper-item class="menu" v-for="(cMenu,index) in menuCList"> <div class="menu-item" v-for="item in cMenu" @tap="linkToLi原创 2021-07-06 15:30:43 · 1172 阅读 · 1 评论 -
解决h5页面在ios端输入框失去焦点后页面不回弹或者底部留白问题(小程序内webview嵌入的h5也适用)
方法就是在输入框失去焦点后(关闭键盘)让页面滚一下(select 标签导致页面底部留白此方法行不通,当用户未改变select 选中的项就关闭选择框不能触发 change 事件,当用户选中后关闭选择框也不会触发blur事件, 除非点击非select 区域才会blur)1、原生页面const windowHeight = window.innerHeightinput.addEventListener('blur', function () { let windowFocusHeight = wi原创 2021-07-02 10:31:33 · 1262 阅读 · 0 评论 -
如何在h5和小程序中适配iphone X全面屏底部的安全区
1、第一步: h5需要设置页面属性: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no,viewport-fit=cover">2、在属性样式上加一段判断覆盖样式:示例代码:.load-more { color: #0080ff; padding-bottom: 32px;}@supports (bottom:原创 2021-07-01 11:23:44 · 1026 阅读 · 0 评论 -
使用wepy2开发小程序生成海报需求
需求描述:在小程序根据已有的dom样式,生成一张图片作为海报图分享出去。方法1、使用官方的canvas api 把想要的dom样式通过画矩形画text一步步画出来。方法2、 简单so easy。 使用Wml2Canvas插件插件地址: github: https://github.com/wg-front/wxml2canvas可以查看官方示例demo, 很简单。第一步:准备好画图的标签和画图的画布canvaswxml: <div class="card share原创 2021-06-30 16:45:28 · 187 阅读 · 0 评论 -
解决微信小程序input textarea输入框内容以及palceholder随页面滚动式跟着滚动,飘起来了。
bug 类型效果:输入框内的文字跑了。解决办法:测试了网上的监听滚动事件,手动调用wx.hideKeyboard等方式,都不好使。大概原因: 在页面出现滚动时,输入框跑了。 如果不是滚动页面,不能滚动,就不会出现。刚开始整个外层标签是<view></view>, 换成<scroll-view></scroll-view> 再加个样式min-height:100vh; 就完美解决了。原因可能和小程序原生对scroll-view内的input等滚动做原创 2021-06-17 17:16:02 · 3007 阅读 · 0 评论 -
记录使用wepy2.0开发小程序遇到的坑
一、先说基本使用1、安装npm install wepy-cli -g全局wepy脚手架如果不想全局安装或是需要兼容wepy1.x的老项目,可以把wepy2.0安装到项目本地。2、使用wepy init standard wepy-project 初始化一个wepy2.0的项目此时可以选择vuex作为store,官方实现的。二、使用中遇到的一些坑1、如何动态绑定样式?除了官方说明的基本的样式绑定外,这种在vue中常用的写法,需要改成下面的这种,才能生效。 <text v-for="(c原创 2021-02-01 17:46:15 · 1151 阅读 · 1 评论 -
使用vue开发项目的时候,异步请求数据,连续触发多次请求导致的渲染的数据列表数据错误的问题解决办法。
问题描述:在vue类型的项目开发中,我们一般都是发起异步请求从服务器获取数据后,根据数组数据使用v-for来动态渲染数据列表。但是,如果一个请求在pending中,再次发送一个请求,最后导致渲染的list,数据重复,或是错误的问题。原因,就是多次请求了异步接口,一个接口没有返回,另外一个接口就发出去了。因为,ajax是一个异步操作。导致,在回调的时候,两次请求成功后的回调都会执行。就导致数据,错误了。什么情况下发生这种现象呢? 譬如下拉滚动加载更多 或是 tab切换。类似,这种,点击tab标原创 2020-08-18 15:58:05 · 8977 阅读 · 2 评论 -
记录使用mpvue开发小程序常常遇到的坑
1、保存全局状态的问题我们在vue项目中,一般都会使用vuex。在react中,一般都会使用redux。那在小程序中呢?答案是,还是可以使用vuex。mupve初始化项目后,有一个页面模板就是使用了vuex。但是,我一般来说,都是需要全局的store,而不是局部页面的。那如何配置解决呢?新建一个store后,然后在主入口,main.js中来关联配置。import Vue from 'vue'import App from './App'// api请求接口import { userLog原创 2020-08-10 18:07:24 · 1274 阅读 · 1 评论 -
mpvue开发微信小程序用户登录功能的实现过程
资料预习:1.一次性授权常规写法,需要获取用户公开信息(头像,昵称等)时,判断调取授权登录接口,但是此方法如果不经处理的话 用户如果拒绝授权或者删除该微信小程序后 需要重新调取并获取用户公开信息(头像,昵称等),此方法用户体验较差,不建议使用;2.永久授权在不必要使用用户公开信息(头像,昵称等)时,不调取授权登录接口,只有在必要的时候再去判断调取授权登录接口并把获取到的用户公开信息存入数据库,这样在每次登录时直接先运行指定函数从数据库索取需要的用户公开信息(头像,昵称等)即可,此方法在删除小程原创 2020-08-10 17:00:19 · 1243 阅读 · 0 评论 -
vue(mpvue)前端登录密码使用AES加密引出的一系列问题
一般来说,都是md5加密密码。但是我司后台,用的是aes家秘密,然后还有密匙之类的。折腾了老半天,总算解决了。记录一下。AES加密,js有一个牛逼的算法库,crypto-js。封装成工具函数,在使用的地方引用。// 密码加密// const CryptoJS = require ('crypto-js')import CryptoJS from 'crypto-js'const key = CryptoJS.enc.Utf8.parse('abcdefrt69845632') // 密匙c原创 2020-07-31 15:30:52 · 1146 阅读 · 0 评论 -
使用mpvue框架,以及vant-weapp的程序员UI框架时,遇到的坑及解决办法。
1、mpvue中使用vant-weapp的方式2、mpvue引入vant-weapp后,mpvue自动将px转换为rpx单位的问题参考https://www.jianshu.com/p/5fb497ec2e5d如果不想自己写的单位被mpvue转换,就将px单位写为PX, 大写的就不会转换为rpx单位了。如果想把vant-weapp的px单位转换为rpx, 就需要修改配置文件。在build/webpack.base.conf.js中安装上面的连接修改var relative = require(原创 2020-07-30 16:49:29 · 853 阅读 · 0 评论 -
mpvue快速搭建小程序项目
1、生成你的mpvue工程vue init mpvue/mpvue-quickstart my-mini-project然后cd my-mini-project安装依赖npm install安装完成后,运行npm run dev跑服务,小程序加载项目文件目录作为文件入口2、配置Vant Weapp官方文档的配置是针对原生写法的,mpvue不适应下载整个vant-weapp ui 框架的包,将dist目录内的文件全部拷贝到项目static 目录下,并且将文件名命名为vant在需要引入原创 2020-07-23 18:18:59 · 367 阅读 · 0 评论