Hero_rong的博客

关键代码就是小程序的hover-class 属性，需要注意的是，hover-class 的属性中的样式必须加!important 不然没有不显示效果

.refund .arrow { width: 18rpx; height: 20rpx; border-top: 2rpx solid #AAAAAA; border-right: 2rpx solid #AAAAAA; transform: rotate(45deg);}

输入的内容没有全部显示，感觉就像是有padding-right属性似的，其实并没有解决办法给input设置 min-width: 78%;或者 max-width: 78%;

小程序是没有直接从手机里面选文件这个功能的，只有从微信聊天记录里面选用的是这个方法wx.chooseMessageFile（） （官方文档戳这里） wx.chooseMessageFile({ count: 10, type: 'file', success(res) { console.log(res); } })...

.wxml <mp-uploader bindfail="uploadError" bindsuccess="uploadSuccess" bindselect="chooseImage" binddelete="deleteImg" select="{{selectFile}}" upload="{{uplaodFile}}" files="{{files}}" max-count="6" title="" tips="请上传整改好的图片">...

需求：选择左边的选项，右边会显示对应的数据。如果你的数据和官方文档一样，数组套数组的形式，那直接复制复制就行了，这篇文章主要讲，数据是数组里面套对象的这种情况我的数据结构如下，这就用用到range-key 属性，首先，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容，如果不加，则页面上显示的都是【object Object】然后，下面展示的数据里面也要添加name属性，要是不加，页面也是显示的【object Object】最后，其他的选择...

第一张图是官方给的效果图，官方链接戳这里，是用小程序自带的weui组件库，我这里是通过useExtendedLib 扩展库的方式引入，这种方式引入的组件将不会计入代码包大小，也可以通过npm方式下载构建，npm包名为weui-miniprogram（前三步都是基础，如果知道怎么使用，只想看一些小提示的，可以从第四步开始）1.先引入useExtendedLib 扩展库，在 app.json 文件里面加入 "useExtendedLib": { "weui": tru...

可以先浏览下官方文档，戳这里还参考了，大神的文章，戳这里首先我的需求，如图，我想要的效果是 2020年11月19日，后端给我的数据是 20201119 ，于是我很自然的，{{item.templateName.slice(0,4)}}，然后报错，发现，小程序不支持在 wxml 页面直接修改。在wxml页面中，只能在插值 {{ }} 中写简单的js表达式，而不能调用方法，例如想截取字符串，就不能调用slice()方法。通常的解决办法是在page的data对象中先把这个字符串截取好赋给某个变

如图， list 的顺序，图片，都没有问题，但是底部的 tabbar 图标就是不显示后来发现这里面两个属性，selectedIconPath 和iconPath ，前者是选中，后者是没有选中的，我一开始测试的时候只写了一个属性，就是没有选中的那个属性，所以才没有显示正确写法是要两个都写的，问题不是什么大问题，记录一下，就是想提醒自己，写代码要仔细一点 "list": [{ "pagePath": "pages/list/index", "sele...

第一步，新建 request.js 文件，把要封装的方法放进去var app = getApp();//项目URL相同部分，减轻代码量，同时方便项目迁移//这里因为我是本地调试，所以host不规范，实际上应该是你备案的域名信息var host = 'http://192.168.1.1:9990/'; //此处本地接口地址/** * POST请求， * URL：接口 * postData：参数，json类型 * doSuccess：成功的回调函数 * doFail：失败的回

var myDate = new Date(); var nowDate = myDate.getFullYear(); nowDate = nowDate + ((myDate.getMonth() + 1) < 10 ? "年" + (myDate.getMonth() + 1) : "年" + (myDate.getMonth() + 1)); nowDate = nowDate + (myDate.getDate() < 10 ? "月" +...

需求：就是在地图上划划划，然后按一下再跳转到当前所在的位置map组件里面啊，必须添加show-location='true' ，否则，跳转不到当前位置html<view class="map"> <map :style="height" id="map" :longitude="longitude" :latitude="latitude" scale="18" :polyline="polyline" :markers="markers" show-location.

vue一般传参就是直接在方法里面加参数就好了，例如：@click="zidingyi(123)"传事件对象的话， 就直接方法名，例如：@click="shijian"，但是不可以@click="shijian()", 如果写了括号，再console.log(e); 结果就是undefined然后，传事件对象的时候，@click="all($event, 123)" ， 直接再方法里面，$event 就好了html<view @click="zidingyi(123)...

uniapp 里面是没有 select 下拉框的， 只有 picker （官方文档戳这里）， 这个是从屏幕下面弹出来的，官方文档说是可以设置数组和数组里面套对象，然后！！大家要记住，在 uniapp 里面，range前面要带冒号，而 range-key 就不用了，这里是个小坑...

使用 justify-content 属性的时候，子级不可以设置 margin: auto， margin-left: auto 和 margin: auto 也不行！如果不小心设置了，margin: auto , 要取消呦，如果是自带的默认的样式，比如 button ，那就要写样式覆盖掉， margin: 0; 就可以了...

小程序授权，经常用到的，获取手机号码，获取用户信息，都是用的bindgetphonenumber 和bindgetuserinfo <button class="phone" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">手机号一键登录</button> <button class="wechat" open-type='getUserInfo' bindgetuserinf..

在 uni-app 里面调用小程序 map ，需求要使用气泡，这里面有两种气泡，一种是默认的，一种是自定义的默认的就是直接在 markers 数组里面添加 title自定义的就是 在 markers 里面添加 callout，这里要注意 color 必须是 十六进制的，必须是六位的！！callout: { content: '我是二号起泡', color: "#ff0000", fontSize: 16, borderRadius: 10, bg...

调用小程序地图的时候要在 app.json 里面配置 permission ，但是uni-app项目中，却是在manifest.json里面配置的"permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" }}然后就会有这个小弹框出来惹...

微信开发工具上都可以提交，一到真机上点击就失效了，莫名其妙后来发现，form 表单里面只可以有零个或者一个auto-focus，只要超过一个按钮就会失效如果，auto-focus 都删完了，但是提交按钮还是失效的话，有一个偏方，给第一个 input 添加auto-focus ，让他自动聚焦，这样也可以解决喔...

首先效果图奉上，右边的胶囊按钮是自带的，我们自定义的是左边的内容（一般情况下我们是不需要自定义头部导航的，我这个是有需求是在tabbar页面要有返回的按钮，但是tabbar页面默认是没有返回的，所以这里我们自定义一下）第一步：.json 文件，添加"navigationStyle":"custom"， 告诉页面，这里导航要自定义了，如果不写这一步的话，下面的写了也出不来 "navigationStyle": "custom"第二步： .wxml 文件，添加我们需要自定义的...

之前写过怎么使用小程序的组件，Weui，今天总结一下，怎么使用自定义组件，以 select 下拉框为例首先，自定义组件，肯定要有组件，我们先在 components 里面新建 select 文件夹 （如果是小程序原生的，里面文件应该会自动生成，我这里用的是 mpvue ，里面的文件 select.js , select.json , select.wxml , select.wxss是要自己添加的）select.wxml<view class='com-selectBox'...

通过useExtendedLib扩展库的方式 引入并使用WeUI第一步，在app.ison 中加入useExtendedLib 字段 "useExtendedLib": { "weui": true }第二步，在所需要的页面的 json 文件中加入usingComponents 字段 "usingComponents": { "mp-uploader": "weui-miniprogram/uploader/uploader", "mp-ce...

如图，点后面这个链接就行了，就会有一个说明文档（https://developers.weixin.qq.com/miniprogram/dev/framework/ability/network.html），大概意思就是需要配置一下域名，然后我们就去配置一下域名，这是配置域名的地址。开发 —》开发设置 —》服务器域名然后把域名放到这里，保存提交，就ok 了！...

如图这里的tab页面，嵌套在页面中间的，上面和下面都有东西， 如果正常设置高度宽度100%，滑动的时候页面显示的就不是100%了，而是比一个页面多，把上面的元素也加上去了，这样肯定不行的，我现在做的时候，就只让它在中间滑动，不可以超出这个页面首先我们这个切换tab的页面是用 swipper + scroll-view 做的，看一下wxml <view class="service-list"> <!-- 切换栏 --> <view class="swipe..

小程序的服务通知小程序的这种通知，作为前段需要向后端传一个参数，formId，那么我们怎么获取的这个formId呢，首先，我们得知道，formId 是 form 表单的 id，当点击form表单中 formType 为 submit 的button组件时，会将表单组件中的 value 值进行提交，这个时候打印 e.detail 就可以看到 formId，但...

图片设置浮动就行了，段落设置首行缩进 text-indent: 24px;，然后要注意的就是，如果没有那么多字，浮动是不占地方的，所以要给外面的view设置最小高度,防止塌陷 <view class='scImgbo'> <image class='siImg' src='{{list.introductImgUrl}}'></image>...

在 onshow()里面请求数据就可以了。

时间捉急，先写一个简单的用着，过几天写个插件wxml<view class="canlendarBgView"> <view class="canlendarView"> <view class="canlendarTopView"> <view class="leftBgView" bindtap="handleCa...

去掉前去掉后将show-confirm-bar设置为空就行了，默认的是true，但是设置为false也是无效，只有设置为空才有效果<textarea name="" id="" cols="30" rows="10"show-confirm-bar=""></textarea>...

给 textarea增加fixed属性：<textarea fixed>即可

小程序，加载图标wx.showLoading wx.showLoading({ title:'加载中', mask:true })//mask是防止屏幕穿透的，默认是false，所以想要拦截屏幕滑动事件，就一定要记得写这一行 wx.hide...

最近在写小程序，由于小程序快满了，就把页面写成h5，嵌在小程序里，原以为很简单，没想到遇到问题，问题不多，但是很大第一个就是点击事件不触发，场景如下：    点击按钮触发ajax请求，请求成功之后跳转到另一个页面，但是页面始终不跳转。解决方法，将http开头的域名换成https开头的，如果你看过其他的文章，发现此方法没有用的话，请看下面的详解 后来不停地alert()，先后...

maxlength='6'     表示input框最多输入6个字符串password='true'  表示该input会自动加密，看不到输入的内容 &lt;input password="true" maxlength="6" placeholder="请输入密码" /&gt;...

此方法用于wx自带的上传图片，然后删除图片的场景deleteImg: function(param) { var index = param.currentTarget.dataset.index; console.log(index); var that = this; wx.showModal({ title: '提示', content: '要删除这...

小程序的元素，比如&lt;view&gt;不可以在wxss里面设置背景图片，只能在&lt;image&gt;里面设置图片如果想在&lt;view&gt;标签上设置背景图片，只能在wxml里面设置行内样式，并且图片还必须是线上图片&lt;view style="background-image: url('{{picAddress}}/sy_card_bg.png'); backgroun...

this.req.call(this); //封装submit函数req: function(param) { //封装req函数 console.log(param);}; 

当后台传过来一个数组的时候，我们发现，需要往里面添加个属性，用起来更方便，这时候，我们就要往数组里面添加一个对象，再使用这个新的数组就可以了var cardNumArr = this.data.cardNumArr;//定义一个空的数组var cardNumObj = this.data.cardNumObj;//定义一个空的对象cardNumObj = { name: this.d...

 bug结果浮点数计算的时候，会出现bug，例如这种情况118.00999999999999，这个时候我们一般只要118.01，把最终得到的结果toFixed(2)，就可以啦。 payMoney = parseFloat(payMoney) - parseFloat(useCardMoney)payMoney = payMoney.toFixed(2);console.l...

通过 checkbox 里面的checked属性来控制checkbox的选中与否  &lt;checkbox value="{{item.name}}" checked="{{item.checked}}"/&gt;&lt;!--checkbox-group就是一个checkbox组 有个监听事件bindchange，监听数据选中和取消--&gt;&lt;checkbox-group...

小程序页面跳转传数组与对象 传递页面：通过JSON.stringify 方法，将数组或者对象转换成字符串后传递click: function(e) { var model = JSON.stringify(e.currentTarget.dataset.model); //将数组或者对象转换成字符串，传递到下一个页面 wx.navigateTo({ url: '....