前端笔记(5月6日-5月8日)

340 阅读1分钟

微信小程序重写checkbox的样式,将方块变成圆形 css

/* 重写 checkbox 样式 */
 /* 未选中的 背景样式 */
 checkbox .wx-checkbox-input{
     border-radius: 50%;/* 圆角 */
     width: 46rpx; /* 背景的宽 */
     height: 46rpx; /* 背景的高 */
 }
 /* 选中后的 背景样式*/
 checkbox .wx-checkbox-input.wx-checkbox-input-checked{
     border: 1rpx solid #f3333e;
     background: #f3333e;
 }
 /* 选中后的 对勾样式 
 checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
     border-radius: 50%;/* 圆角 */
     width: 40rpx;/* 选中后对勾大小,不要超过背景的尺寸 */
     height: 40rpx;/* 选中后对勾大小,不要超过背景的尺寸 */
     line-height: 40rpx;
     text-align: center;
     font-size:30rpx; /* 对勾大小 30rpx */
     color:#fff; /* 对勾颜色 白色 */
     background: transparent;
     transform:translate(-50%, -50%) scale(1);
     -webkit-transform:translate(-50%, -50%) scale(1);
 }

wx:for

在组件上使用 wx:for 控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。 默认数组的当前项的下标变量名默认为 index,数组当前项的变量名默认为 item\

filter 筛选对应指定数组中的值

list = this.data.drugList.filter(item => {
  return checkboxChecked.indexOf(item.timestamp + '') === -1
})

时间戳

  • 1、 var timestamp1 = Date.parse( new Date());
  • 2、 var timestamp2 = ( new Date()).valueOf();
  • 3、 var timestamp3 = new Date().getTime();

第一种获取的时间戳是精确到秒,第二种和第三种是获取的时间戳精确到毫秒。

获取指定时间的时间戳:

new Date("2016-08-03 00:00:00");

时间戳转化成时间:

function timetrans(date){
    var date = new Date(date*1000);//如果date为13位不需要乘1000
    var Y = date.getFullYear() + '-';
    var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
    var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
    var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
    var m = (date.getMinutes() <10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
    var s = (date.getSeconds() <10 ? '0' + date.getSeconds() : date.getSeconds());
    return Y+M+D+h+m+s;
}

JavaScript判断输入框是否为空:

var str = val.replace(/(^\s*)|(\s*$)/g, '');//去除空格;

        if (str == '' || str == undefined || str == null) {
            //return true;
            console.log('空')
        } else {
            //return false;
            console.log('非空');