VueJiang的博客

要实现的效果: 在写项目的过程中,可能会遇见ui设计会话客服放在tabbar上的情况,但是会话消息必须通过button触发,然鹅小程序的默认tabbar层级最高,没办法再上面添加button事件,这时,我们就需要实现一个自定义tabbar, 我用的是Vant ui组件库,其它的也行,主要原理就是tabbar上放一个按钮,挡住原本的tab就行啦!Vant 小程序官网(一定要是小程序版本的哟,之前引入了vue版本的,实现不了,排查了好久问题)小程序自定义tabbar官网教程第一步://app.json

1 阻止事件冒泡//catchtap替换bindtap<view bindtap='goDetails'> <!-- catchtap:可阻止冒泡事件,这样就不会同时执行两个事件 --> <text class="btn" catchtap='btnClick'>点击操作</text> </view>2 wx.previewImage点击显示大图(放大黑屏解决)//wxml <view class="imgB

//wxml <button class='button' bingtap="uploadSomeMsg">上传</button> <view class="uploadImgBox"> <view class='smallImgBox'> <block wx:for="{{img_arr}}" wx:key="index"> &lt

实现微信小程序定位并不难,但是如果第一次接触的话还是很懵,这里就记录一下,方便自己复习或大家借鉴吧!首先重点有两条:通过微信小程序api: wx.getLocation(Object object)获取当前所在的经纬度; 小程序api详情通过腾讯地图开放平台逆地址解析获取的经纬度,获取真实地标名称; 腾讯地图平台 具体操作:(腾讯地图方面的操作)注册腾讯地图开放平台:申请开发者密钥（Key）：申请密钥 https://lbs.qq.com/dev/console/key/add成功后

今天想记录一下怎么向后台请求数据，将函数进行封装，实现复用~官方的请求方法：https://developers.weixin.qq.com/miniprogram/dev/api/network/request/wx.request.html这是封装好的函数：公共函数async function request(url, { method = 'GET', data } = {}) { wx.show.

记录一下困扰自己的一个小问题，也给各位小伙伴一个借鉴呀~在做自己的个人小程序项目时，需要实现用户下拉刷新数据，看了很多教程，都在说用scroll-view来实现，但是自己对样式要求不高，就使用微信自带的吧~实现的效果：#####1 如果需要全局都实现下拉刷新的话，可以在app.json文件，window里面进行配置启用下拉刷新，只有一两个页面不需要下拉刷新的话，就在页面的json文件内配置，关闭下拉刷新开启全局下拉刷新----->app.json：{ "window": { .

在开发图片展示类的小程序时，swiper组件是非常好用的，但是其中也有些“坑”，等着你去踩。好啦,我已经踩过了，给各位一个借鉴吧~#####效果：[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0BSu8zg4-1590551408090)(https://upload-images.jianshu.io/upload_images/17596677-6d9e944a38a6b02f.gif?imageMogr2/auto-orient/strip)]##1.使用首先.

今天，我们要实现如下的效果，进入详情页，获取产品的具体数据。本文请求的数据是本地的，实际开发是要通过ajax请求服务器中的产品数据，为了避免业务代码扰乱视听，只截取了关键代码~1.首先我们需要两个页面，一个首页（就是产品列表页），一个详情页（产品的具体数据页）首页wxml代码：这里举例的是传id到详情页，这样详情页才知道我们需要加载的是哪个产品，也可以传index下标，不过感觉id更靠谱些。(id是你产品列表里面的数据，渲染列表时拿到的) <!-- bindtap绑定的是首页跳转函数， .

##1.创建动态classwxml : <view class="collectTypeBox flex"> <!-- 下面collectType是条件， collectActive是动态class名称 --> <text class="flex {{collectType==0?'collectActive':''}}" bindtap="personalCollect" data-type="0">旅行</text>

开发微信小程序时，有时设置页面样式，需要用到头部固定，内容滚动，下面看看怎么做的吧！##方法一：1：固定元素需要固定的元素盒子设置样式：.box{ position: fixed; top: 0; width: 100%;}2：隐藏滚动条父元素设置：.fatherBox{ width: 100vw;height: 100vh;overflow-x: hidden;overflow-y: auto;}滚动条所在的盒元素设置：.songBox::-we

1：wxss样式：/* 页面显示图片的框 */.showTableBox { position: relative; width: 100%; height: 180px; overflow: hidden;}/* img图片所在的父元素盒子，有几张img，width就设置百分之几百 */.slideshowImgBox { position: absolute; z-index: 1; width: 500%; height: 1

官方链接：https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#useExtendedLib最近开发小程序，需要用到微信的ui组件，由于自己没好好看文档，不知道官网上引用的“useExtendedLib”是在哪个文件中引用，蠢哭了，搜索了好多教程都是下载代码，手动配置，挺简单，但是使用时路径怎么都不对，报错。回到文档上，其实只要仔细看看，是在全局引用，一切都豁然开朗，下面开始吧！1.在全局jso

微信小程序引入Iconfont图标（可修改样式）1:添加需要的图标至项目;链接：https://www.iconfont.cn/home/index?spm=a313x.7781069.1998910419.22:下载至本地;3:解压，找到iconfont.css ，更改后缀名为confont.wxss;4:在app.wxss文件中引入（全局文件中引入，路径要正确哦~）/* app.wxss文件 */@import"./iconfont/font_1799731_h63n8jiz5a4//ic