为您找到搜索结果：3415个
微信小程序--图片上传删除
小程序前台页面：//图片上传--添加图片afterRead(event){varthat=this;const{file}=event.detail;//console.log(file.path);//当设置mutiple为true时,file为数组格式，否则为对象格式wx.uploadFile({url:'http://www.xcxshoplars.com/api/upload_image',//仅为示例，非真实的接口地址filePath:file.path,name:'file',formData:{user:'test'},success(res){console.log(res.data);vardatas=JSON.parse(res.data);varimage="http://www.xcxshoplars.com"+datas.data;//后台传过来的地址地址varfileLists=[];fileLists=that.data.fileListletimagesInfo={url:image}fileLists.push(imagesInfo)that.setD...
微信小程序----返回上一页刷新或当前页刷新
WXRUI体验二维码 如果文章对你有帮助的话，请打开微信扫一下二维码，点击一下广告，支持一下作者！谢谢！声明bug：在onShow中执行this.onLoad()，会导致页面第一次加载的时候数组加载两次！造成原因：页面加载先执行onLoad，再执行的onShow，就会出现在onLoad加载一次数据，在onShow中执行this.onLoad()在加载一次数据。解决办法：将不需要刷新的数据放在onLoad中执行，将需要刷新的数据放在onShow中执行！感谢：感谢editplusx的指正！HTML实现当前页面刷新首先我们都知道在HTML页面我们要实现当前页面刷新一般会怎么解决呢？1，reload()方法刷新当前页面；2，replace()方法刷新当前页面；3，页面自动刷新当前页面；三种实现js刷新当前页面的方法用法微信小程序----返回上一页刷新或当前页刷新1，在实现效果之前，需要知道微信小程序的页面生命周期，不是很清楚的可以看微信小程序----页面生命周期；2，可以知道微信小程序的页面是由onLoad（页面加载）、onReady（页面初次渲染完成）、on...
微信小程序自定义导航栏（wx_custom_navigation_bar） 自定义返回键、首页键，动态设置标题，响应式组件
github: https://github.com/chen-yt/wx_custom_navigation_bar https://github.com/Superman2113/wx_custom_navigation_bar navbar组件navbar.wxml<viewclass="navbar"style="{{'height:'+navigationBarHeight}}"><viewstyle="{{'height:'+statusBarHeight}}"></view><viewclass='title-container'><viewclass='capsule'wx:if="{{back||home}}"><viewbindtap='back'wx:if="{{back}}"><imagesrc='img/back.svg'></image></view><viewbind...
微信小程序导入Vant-Weapp组件库及出错处理
微信小程序导入Vant-Weapp组件库及出错处理一、下载Node.js*链接：https://nodejs.org/en/推荐选择LST的8.0以上版本，下载安装即可，安装完成后可以进行验证cmd打开终端，输入vant-v出现对应版本即为安装成功，也可输入npm-v查看对应的npm版本 链接：https://youzan.github.io/vant-weapp/#/intro后续可根据开发指南进行操作三、安装Vant组件库选中miniprogram文件，右键选择在终端打开，输入npmivant-weapp-S--production进行安装安装完成后，在微信开发者工具窗口，选择“工具”->“构建npm"，构建成功后，在miniprogram下会出现miniprogram_npm文件夹，对应的下面的就是vant组件库 选择微信开发工具的详情 勾选”使用npm模块“选项，才算完成 比如要在pagës/indeks/indeks里添加一个组件库里的button在index...
微信小程序，左上角返回首页小房子
github: https://blog.csdn.net/Chen_ITO/article/details/83651917 需求：微信小程序分享出去的页面，需要左上角加上小房子，点击回到主页；这里就需要涉及到自定义头部效果图：代码：PS：代码直接复制到wxml和wxss里面即可1、在test.json中加入 {"navigationStyle":"custom"} 这个就是全屏的意思2、在test.xml中加入 <viewclass="inaver_30f2b4d"style="background:{{background}};color:{{getColor}}"><viewclass="left_30f2b4d"catchtap="goBack"><imageclass="icon_30f2b4d"src="/images/ic_home_normal.png"/></view><viewclass="center_30f2b4d"><!--自定义区...
微信小程序无法获取到unionId(专业踩坑20年)
UnionID机制说明如果开发者拥有多个移动应用、网站应用、和公众帐号（包括小程序），可通过unionid来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号（包括小程序），用户的unionid是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用，unionid是相同的。我们系统都做了移动应用、网站应用、和公众帐号的微信登入，我们后端这边是有微信绑定账号功能的。所以需要在微信的给出的用户唯一的unionID判断该用户是否已绑定微信号。 微信小程序API详情的官方链接: https://developers.weixin.qq.com/miniprogram/dev/api/api-login.html#wxloginobject微信官方的流程图：前端调用wx.login获取code，然后将code返回给后台拿着code与appid，secret访问微信接口获取session_key、openid和 unionId 看一下拿code请求成功后，微信官方给出的返回结果： 我当...
微信小程序利用canvas生成海报分享图片
一.效果这是借用女神照生成的分享的海报，图片来自网络。 新增了poster组件和更新图片自适应 二.准备准备两张图片连接，最好是自己开发账号验证的https图片链接。三.实现思路其实就是canvas实现方式，首先要就是定义一个canvas容器，把容器放在中间，图片也要动态计算大小居中，显示下面的文字和二维码也是要根据容器动态去改变，这就是大概的实现思路。四.实现代码利用微信小程序canvas生成海报分享图片，这个生成图片排版和适配不同尺寸的手机是一个难点，特别是图片适应问题，我处理的方法是动态获取容器的宽度进行适应就是利用微信APIwx.createSelectorQuery(),不知道还有没有更好的办法可以请教。1.下载头像为了确保图片下载完成之后，再回调其它方法执行下一步。getAvaterInfo:function(cardInfo){//cardInfo是传入的信息参数，按实际需要。wx.showLoading({title:'生成中...',mask:true,});varthat=this;if(cardInfo.CardInfo.Avater){wx....
微信小程序之自定义模态弹窗（带动画）实例
1、基本需求。实现用户自定义弹框带动画（动画可做参靠，个人要是觉得不好看可以自定义动画）获取弹出框的内容，自定义事件获取2、案例目录结构二、程序实现具体步骤1.弹框index.wxml代码<!--button--><viewclass="btn"bindtap="powerDrawer"data-statu="open">来点我呀</view><!--mask--><viewclass="drawer_screen"bindtap="powerDrawer"data-statu="close"wx:if="{{showModalStatus}}"></view><!--content--><!--使用animation属性指定需要执行的动画--><viewanimation="{{animationData}}"class="drawer_box"wx:if="{{showModalStatus}}"><!--drawercontent--><viewclass...
微信小程序scroll-view 横向和纵向scroll-view组件
scroll-view为滚动视图，分为水平滚动和垂直滚动。注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效。滚动视图常用的地方一般都是Item项比较多的界面，比如我的模块主要属性： 使用演示：wxml<!--垂直滚动，这里必须设置高度--><scroll-viewscroll-y="true"><view></view><view></view><view></view><view></view></scroll-view><!--white-spacenormal:正常无变化(默认处理方式.文本自动处理换行.假如抵达容器边界内容会转到下一行)pre:保持HTML源代码的空格与换行,等同与pre标签nowrap:强制文本在一行,除非遇到br换行标签pre-wrap:同pre属性,但是遇到超出容器范围的时候会自动换行pre-line:同pre属性,但是遇到连续空格会被看作一个空格inherit:继承--><...
微信小程序 Unexpected end of JSON input/Unexpected token o in JSON at position 1
原因JSON.parse无法识别某些url中的特殊字符，所以报错 mistakes.js中nextBtn:function(){varnextData=this.data.dataNextInfo;console.log(nextData.pop());varnextDatas=JSON.stringify(nextData.pop()) wx.redirectTo({url:'../mistakes1/mistakes1?nextDatas='+encodeURIComponent(nextDatas)}) 跳转页:mistakes1.js/***生命周期函数--监听页面加载*/onLoad:function(options){ varnextData=decodeURIComponent((options.nextDatas));console.log(JSON.parse(nextData));}, 解决方案在JSON.stringify()之后将变量使用encodeURIComponent函数处理，enc...
微信小程序之回调函数
在微信小程序中众所周知在js里面得方法都是异步执行，我最近再做项目得时候也遇到了这个问题，再方法里面调用另一个方法里面的接口数据，第一次是调取不到的， 因为两个方法是同时开始执行得，所以怎么都取不到值，在网上看了各个大神的方法，基本上都是用promise的方法解决的，我原本也想用这个方法解决，别人告诉我说是不是也可以用回调函数解决了，于是试了一下，刚开始一直在报错，我以为这种方法不能用，又试了几次之后发现是我自己的方法写错了（原谅我是小白，对回调函数不是特别熟悉，所以试了很久）后来终于成功了，贴图：、这是调用的地方，原谅我的命名不是特别规范 这是被调用的函数体，利用这种方法就可以完美解决这个问题，第一次解决这个问题，如果有哪里不对的地方，欢迎各位大神指出^_^...
微信小程序动态设置图片大小
我们都知道微信小程序的组件image是用来显示图片的，它有一下几个属性：1、src 图片资源地址2、mode 图片裁剪、缩放的模式3、binderror 当错误发生时，发布到AppService的事件名，事件对象event.detail={errMsg:‘somethingwrong’}4、bindload 当图片载入完毕时，发布到AppService的事件名，事件对象event.detail={height:’图片高度px’,width:’图片宽度px’}但是image有默认的固定的宽度和高度，这样我们在做图片自适应的时候，就不好做了，特别是我们在做一些商品详情页的时候，需要image自适应屏幕,按原图比例显示。那么如何让image自适应比例显示呢？可以有两种方法： 一、使用mode：widthFixwidthFix：宽度不变，高度自动变化，保持原图宽高比不...