小程序个人常用代码
注：是我自己在开发过程中用到的一些代码，不能算是教程，只是开发过程中做为参考
image mode 的合法值
| 值 | 说明 |
|---|---|
| scaleToFill | 缩放模式，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 |
| aspectFit | 缩放模式，保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。 |
| aspectFill | 缩放模式，保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。 |
| widthFix | 缩放模式，宽度不变，高度自动变化，保持原图宽高比不变 |
| top | 裁剪模式，不缩放图片，只显示图片的顶部区域 |
| bottom | 裁剪模式，不缩放图片，只显示图片的底部区域 |
| center | 裁剪模式，不缩放图片，只显示图片的中间区域 |
| left | 裁剪模式，不缩放图片，只显示图片的左边区域 |
| right | 裁剪模式，不缩放图片，只显示图片的右边区域 |
| top left | 裁剪模式，不缩放图片，只显示图片的左上边区域 |
| top right | 裁剪模式，不缩放图片，只显示图片的右上边区域 |
| bottom left | 裁剪模式，不缩放图片，只显示图片的左下边区域 |
| bottom right | 裁剪模式，不缩放图片，只显示图片的右下边区域 |
设置text只显示两行
display: -webkit-box;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;文字单行显示
text-overflow: ellipsis;
white-space:nowrap;
overflow: hidden;向下的阴影
box-shadow: 1rpx 0rpx 4rpx 1rpx rgba(85, 85, 85, 0.20);
box-shadow: h-shadow v-shadow blur spread color inset; 注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。
值 描述 测试
h-shadow 必需。水平阴影的位置。允许负值。
v-shadow 必需。垂直阴影的位置。允许负值。
blur 可选。模糊距离。
spread 可选。阴影的尺寸。
color 可选。阴影的颜色。请参阅 CSS 颜色值。
inset 可选。将外部阴影 (outset) 改为内部阴影。
获取list列表一个点击的item
var item = event.currentTarget.dataset.item;
input 的event事件
var value = event.detail.value;
防止点击穿透
catchtap
强制设置属性值覆盖
width: 100%!important;
设置边框
border: 1px solid rgba(0, 0, 0, 0.2)
设置背景图片，及排列方式 background-size: contain; background-size: length|percentage|cover|contain;
设置按钮
从右到左的背景渐变 background: linear-gradient(to left,#EA4A12,#D93E2C);
length
设置背景图像的高度和宽度。
第一个值设置宽度，第二个值设置高度。
如果只设置一个值，则第二个值会被设置为 "auto"。
percentage
以父元素的百分比来设置背景图像的宽度和高度。
第一个值设置宽度，第二个值设置高度。 如果只设置一个值，则第二个值会被设置为 "auto"。
cover
把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。
背景图像的某些部分也许无法显示在背景定位区域中。
contain 把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域
文字下划线
text-decoration:none 无装饰，通常对html下划线标签去掉下划线样式 text-decoration:underline 下划线样式 text-decoration:line-through 删除线样式-贯穿线样式 text-decoration:overline 上划线样式
设置边框固定
box-sizing:border-box;
list数组添加内容
list.push arrayObj.unshift([item1 [item2 [… [itemN ]]]]);// 将一个或多个新元素添加到数组开始，数组中的元素自动后移，返回数组新长度 arrayObj.splice(insertPos,0,[item1[, item2[, … [,itemN]]]]);//将一个或多个新元素插入到数组的指定位置，插入位置的元素自动后移，返回”“。
arrayObj.pop(); //移除最后一个元素并返回该元素值 arrayObj.shift(); //移除最前一个元素并返回该元素值，数组中元素自动前移 arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素，数组形式返回所移除的元素
小程序插件使用wx.createSelectorQuery()获取不到节点信息
发现小程序一个bug, 在小程序插件中使用wx.createSelectorQuery()获取不到节点信息,需要在后面加入in(this)
例如:
const query = wx.createSelectorQuery().in(this) query.selectAll('#id-selector').boundingClientRect() query.exec(function (res) { console.log(res) })
组件向小程序发送event事件
this.triggerEvent("tabChangeListener", detail);
获取当前年月日
function getNowFormatDate() {
var date = new Date();
var seperator1 = "-";
var year = date.getFullYear();
var month = date.getMonth() + 1;
var strDate = date.getDate();
if (month >= 1 && month <= 9) {
month = "0" + month;
}
if (strDate >= 0 && strDate <= 9) {
strDate = "0" + strDate;
}
var currentdate = year + seperator1 + month + seperator1 + strDate;
return currentdate;
}
————————————————
版权声明：本文为CSDN博主「qq_21937107」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_21937107/article/details/90081443发送验证码 计时60秒
//计时60秒
that.setData({
ver_s:60
})
var timer = setInterval(function () {
console.log(""+that.ver_s);
that.data.ver_s--;
that.setData({
ver_s:that.data.ver_s
});
if(that.data.ver_s<=0){
clearInterval(timer);
}
}, 1000);上传图片
wx.uploadFile({
url: app.url + '/api/v1/upload/UpLoadFiles',
filePath: path,
name: 'file',
header: { 'content-type': 'application/json' },
formData: {
'Data': {
OpenID: app.openid
}
},
success(res) {
console.log("图片上传成功",res);
},
fail(error) {
}
});选择图片
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success (res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths
}
})字符串转double
parseFloat(value)
字符串转int
parseInt(value)
double保留两位小数
value..toFixed(2)
发表评论