JS - el-table - :row-key
getRowKey(row) {
/** 检查row.id是否有重复的缓存对象 */
if (!this.checkRepeatObj) {
this.checkRepeatObj = {}
}
if (row) {
if (row.id) {
if (this.checkRepeatObj[row.id]) {
if (!row._secondId) {
row._secondId = Math.random() + ''
}
/** 方便根据key重用元素 */
return row._secondId
} else {
this.checkRepeatObj[row.id] = 1
return row.id
}
}
console.log('row.id为空')
if (!row._secondId) {
row._secondId = Math.random() + ''
}
return row._secondId
} else {
console.log('row为空')
return Math.random() + ''
}
}
CSS - div 背景有透明度但文字不透明
/*background: #26272d;*/
background-color: rgba(38, 39, 45, 0.7);
position: relative;
/*opacity: 0.7;*/
filter: Alpha(opacity=70);
JS - 禁用 底部 的后退功能
window.addEventListener('popstate', function () {
history.pushState(null, null, document.URL)
})
前端使用 苹方字体 附录字体下载
@font-face {
font-family: 'pingFangSC-Regular';
src: url('../font/PingFang.ttf');
font-weight: normal;
font-style: normal;
}
* {
font-family: 'pingFangSC-Regular';
}
基于 el-tree 的本地搜索时显示子级 组件
html
<zc-tree v-model="addFormData.empData"
:isExpand="true"
:isFilter="true"
:searchName="'name'"
:nodeKey="nodeKey"
:Selecteds="addFormData.empData"
ref="treeData"
:options="empTreeData"
:props="propsData"></zc-tree>
vue-router 新窗口打开页面
const { href } = this.$router.resolve({
name: 'user',
query: {}
})
window.open(href, '_blank')
el-upload - :before-upload 中 使用接口方法
beforeAvatarUpload (file) {
let that = this
return new Promise((resolve, reject) => {
// 图片不能大于500k
const isLt500K = file.size / 1024 / 1024 < 5
let arr = file.name.split('.')
let type = arr[arr.length - 1]
let testmsg = /^(jpeg|png|jpg)$/.test(type)
let name = file.name
let nameArr = name.split('.')
let url = '/person/validateIdNo'
let param = {
idNo: nameArr[0] || ''
}
// eslint-disable-next-line no-unused-vars
let isName = false
AxiosApi(url, {}, 'GET', param).then(res => {
if (res.status === 200) {
isName = true
if (!testmsg) {
that.addVis = false
MsgShow('error', '请上传jpeg、jpg、png格式的图片!', 2000)
}
if (!isLt500K) {
this.addVis = false
MsgShow('error', '上传图片大小不能超过5MB!', 3000)
}
this.$forceUpdate()
if (testmsg && isLt500K) {
resolve()
} else {
// eslint-disable-next-line prefer-promise-reject-errors
reject()
}
} else {
that.addVis = false
MsgShow('error', '照片名称需要使用用户的正确格式的证件号码 !', 2000)
this.$forceUpdate()
// eslint-disable-next-line prefer-promise-reject-errors
reject()
}
})
})
},