1. element-ui 日期选区禁用,设置属性
disabledDate: (time) => {
const curDate = (new Date()).getTime()
const day = 10 * 24 * 3600 * 1000
const dateRegion = curDate + day
return time.getTime() < curDate - 24*3600*1000 ||
time.getTime() > dateRegion
}
2. vue - filter
使用 export 导入公用 js export { parseTime, formatTime , zero} from '@/utils'
一举两得 : 管道写法 + require js 直接使用 函数
3. 四舍五入 Math.Round() && Number.toFixed()
Math.Round() *10 - /10 精度ok -》number
Number.toFixed() 输出字符串,精度不准,五舍六入 (精确位前为奇数)、四舍五入 (精确位前为偶数)
4. element-ui 文件上传 - 自动覆盖 、 文件上传过程中 钩子函数失效
上传成功 - 修改 传参 fileList,长度大于2 - 截取
去掉 mock。js - 修复文件上传过程中 钩子失效问题
5. vue-photo-preview 预览失效问题
预览 - 空数据 -》有数据 预览失效 ( 低版本 vue-photo-preview , 不使用此控件,自定义悬浮框实现 )
6. css calc 样式 引起的不停闪动问题 (自动计算 , 修复:使用定高/换种效果)
7. 页面传参
1. url 显示参数 path - query
this.$router.push({ path: '/systemSetting/editUser', query: { id: id }})
this.$route.query.id
2. url 不显示参数 name - params
this.$router.push({ name:'addUser', params: { id: id }})
this.$route.params.id
3. url 显示参数
this.$router.push({ path: `/describe/${id}` })
路由配置(路径加指定参数) { path: '/describe/:id', name: 'Describe', component: Describe }
this.$route.params.id
8. 获取 dom
<!-- `vm.$refs.p` will be the DOM node -->
<p ref="p">hello</p>
9. encodeURIComponent(test1) decodeURIComponent(test1)
10. redirect 路由重定向 (存在,其他跳转路由都无效)
$route.redirectedFrom 如果存在重定向,即为重定向来源的路由的名字
11. new Date() 兼容性
new Date() 无兼容性 new Date(时间戳) 无
new Date('Wed Oct 16 2019 16:08:09 GMT+0800') 无 ‘/’连接的 无
new Date(‘2018-8-8’)有 ‘-’链接的有
var d=new Date(); var n=d.toISOString(); 2019-09-18T06:29:12.531Z
12. key 值重复 - 页面卡死问题
key 值重复( 开发环境 error 提示 ) - 生产环境打包 - 错误难分 + 导航跳转失败
13. 高亮 highlight-current-row
14. 表头样式 :header-cell-style="{'background-color':'#ccc'}"
15. 溢出悬浮 :show-overflow-tooltip="true"
16 . 插槽
<template slot-scope="scope">{{ scope.row.orderNo }}</template>
<template slot-scope="{row}"> <img :src="row.fileAddress" /> </template>
17. 宏微队列
this.multipleSelectionFeeItem = [];
this.$nextTick(() => {}) 使用紧随 v-if、v-show 其后 (执行队列小间隙)
18. axios 模板
axiosTest(){
axios.post('http://10.31.1.125:10082/msg/api/sendMessageWeb', {
app:this.noticeForm.plantCode,
createUser:this.userName,
createUserCode:this.depCode,
// extCode:'',
msgContent:this.noticeForm.msgContent,
phoneNumber:this.noticeForm.phoneNumber,
arr:[1,2,3]
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
},
19. value没有冒号,说明是字符串,只要给前面加上冒号就行了
20. 路由跳转
myvue.$router.push('/repayManage/bindCard')
21 设置复选
selectedTable(arr){
var that=this;
arr.forEach(function(val,index){
that.$refs.multipleTableFree.toggleRowSelection(that.tableDataFee[val],true);
})
},