注:是我自己在开发过程中用到的一些代码,不能算是教程,只是开发过程中做为参考

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)

发表评论

邮箱地址不会被公开。 必填项已用*标注