跳过eslint验证
/* eslint-disable */
web端连接微信云数据库
刚安装完的yarn或者cnpm,禁止运行脚本问题解决
PowerShell，以管理员身份运行
输入 set-ExecutionPolicy RemoteSigned
A/Y
本地服务器
image.png
sourcetree 下载
git 通过ssh拉取代码
slot-scope 插槽属性
<slot name="haha" :row="data" />
...
<template slot="haha" slot-scope="{row}">{{row.name}}</template>
// or
<template slot="haha" slot-scope="scope">{{scope.row.name}}</template>
sass sass-loader
"sass": "1.26.8",
"sass-loader": "8.0.2",
阻断请求
return Promise.reject(new Error(res.message || "Error"));
namespaced: true时的调用
this.$store.commit("app/SET_APP_INFO", appInfo);
input file文件上传路径预览
const file = e.target.files[0];
console.log(file.type); //上传文件的类型
let src = window.URL.createObjectURL(file);
:last-child 不生效问题
父元素底下只能有class为limit-top的列表才可以,如果你遇到这个问题,直接列表外面包一个div就好了
蓝湖rem换算公式
蓝湖设计图机型尺寸：750 * 2046
开发机型尺寸：414 * 736
30px = 750/414*16
image.png
input 获取焦点可能失效问题解决
//失效
this.$refs['input'].focus()
//成功 不用ref绑定，使用原生id获取
document.getElementById("input").focus();
base64加密解密
import { Base64 } from "js-base64";
...
Base64.encode() //加密
Base64.encodeURI() //用于加密URL
Base64.decode() //解密 也可以解密 encodeURI
yarn cnpm 安装失败等
也有可能是在环境变量中未配置
参考地址
生成一个随机随
function random(min, max) {
return Math.floor(Math.random() * (max - min)) + min;
}
数组去重复
function unique(arr) {
if (!Array.isArray(arr)) {
console.log('type error!')
return
}
var array = [];
for (var i = 0; i < arr.length; i++) {
if (array .indexOf(arr[i]) === -1) {
array .push(arr[i])
}
}
return array;
}
.toLocaleString()方法
var d=new Date();
var n=d.toLocaleString();//2020/11/6 上午9:46:51
let num=12345678;
console.log(num.toLocaleString()); // 12,345,678
查找字符串是否包含 "Runoob":
var str = "Hello world, welcome to the Runoob。";
var n = str.includes("world"); //true
把数组内相似的对象合并到一个数组中
let arr1 = [],
arr2 = []
let newObj = _.cloneDeep(row)
// console.log(newObj.subTaskTemplates);
let num = 0
// 对编辑的数据进行重排，把taskGroupId相似的重新组合成一个任务组分类
newObj.subTaskTemplates.forEach(item => {
// taskGroupId为0的默认为子任务，不需要进行任务组分类
if (arr1.includes(item.taskGroupId) && item.taskGroupId !== 0) {
let index = arr1.findIndex(item2 => item2 === item.taskGroupId)
item.id = item.id
arr2[index].subTaskTemplates.push(item)
} else {
arr1.push(item.taskGroupId)
let obj = {
id: item.id,
pause: item.pause,
taskGroupId: item.taskGroupId,
taskTemplateId: item.taskTemplateId,
type: item.type,
subTaskTemplates: [item]
}
arr2.push(obj)
}
})
console.log(arr1, arr2)
arr2.forEach(item => {
if (item.subTaskTemplates.length <= 1) {
delete item.subTaskTemplates
}
})
newObj.subTaskTemplates = arr2
this.$refs['taskTemplate'].ruleForm = { ...newObj }
console.log(this.$refs['taskTemplate'].ruleForm)
解决 flex-grow 内容撑开问题
flex-basis:0;
align-self: baseline;
解决 flex 图片拉伸问题
flex-shrink:0;
解决表格td内容撑大
table-layout: fixed;
高亮搜索的文字
//高亮文字方法
const highlightText = (search, text) => {
/**
* s 检索文字
* t 结果文字
*/
let sArr = search.split('');
let tArr = text.split('');
return tArr.map(t => {
let red = false
sArr.map(s => {
if (s === t) {
red = true
}
})
if (red) {
return <span className={styles.red}>{t}</span>;
} else {
return <span>{t}</span>;
}
})
};
移动端滚动穿透问题
document.body.style.overflow = 'hidden';
document.body.style.overflow = 'auto';
input 默认147px长度问题
<input
name="tel"
type="text"
style={{width:'100%'}}
/>
@media媒体查询适配
//小于 414px 尺寸的手机采用这个字体
@media screen and (max-width: 721px) {
html{
font-size: 22.5px;
background-color: red;
}
}
element-ui 表格多选
image.png
image.png
element-ui 表格列用v-if造成错乱的问题
给每列加上一个 key
<el-table-column key="1" label="权益人信息" v-if="activeName == '3'"></el-table-column>
<el-table-column key="2" label="成交房信息" v-if="activeName == '4'"></el-table-column>
