20220729

1.vue视图更新问题

// 使用this.$set触发不了数组视图更新，使用数组的splice触发视图
this.$set(this.see, i, true) ×
this.see.splice(i, 0, true) √
// this.$nextTick()里面修改数组push视图不更新，去掉之后却能（原因未知，可能跟批更新有关系）。总结：不要滥用$nextTick。

2.html表格样式复写

// 表格样式复写不要使用 border-collapse: collapse;合并边框，不然想要给表格加圆角会导致冲突无法实现。
// 正确做法：不使用 border-collapse: collapse; 使用 border-spacing: 0;设置相邻单元格边框之间的距离（前提：border-collapse: separate;默认），然后中间的表格样式由td设置边框实现，多余的则要去掉。
.hr-m-table {
    width: 6.14rem;
    border-spacing: 0;
    border-radius: 0.25rem;
    border: 0.01rem solid #EDEFF7;
    box-sizing: border-box;
}
.hr-m-table td {
    border-bottom: 0.01rem solid #EDEFF7;
    border-right: 0.01rem solid #EDEFF7;
    font-size: 0.21rem;
    font-weight: 400;
    color: #242733;
    padding: 0.17rem 0 0.17rem 0.17rem;
}
.hr-m-table tr:last-child td {
    border-bottom: 0;
}
.hr-m-table tr td:last-child {
    border-right: 0;
}

3.移动端vant textarea不可滑动

// 在webview中van-field的textarea区域滑动（touchmove）失效，除textarea以外的内容均可触发滑动事件。
// 解决弹出层备注框touch导致页面不能滑动的问题
window.addEventListener('touchmove', (e) => {
     let target = e.target
     if (target && target.tagName === 'TEXTAREA') {
         e.stopPropagation();
     }
 }, true)