1. 登录模块，使用enter键怎么也登录不了？一直刷新页面 @keyup.enter.native
看网上都说加上.native 修饰符就好了，我的怎么也好不了。 后来在 el-form 组件上增加@submit.native.prevent 就好了。
听码友解释：当一个表单下，如果只有一个文本框时，按下回车将会触发表单的提交事件。使用@submit.native.prevent阻止表单默认提交。
2. .env .env.development .env.production 这三个文件，如何配置，以及配置规则
在项目serve 和 build 的过程中，我没有用到.env文件（个人觉得不需要这个）, 因为
.env.development 表示开发环境下的配置（你在本地运行项目的时候会读取此文件的 常量的值）
.env.production 表示生产环境下的配置文件（ 你在build打包的时候，会读取此文件的常量）
所以，我只要在这两个文件内设置我想要的常量值就行了。 例如：我打包的时候路由是hash 模式的， 但是我本地运行我想要 history 模式的；
那么我就在.env.development 文件中设置： VUE_APP_ROUTER_MODE = history
.env.production 中设置： VUE_APP_ROUTER_MODE = hash
webpack 其实很强大，我们甚至可以修改打包之后静态文件的文件夹生成位置等；
注： 常量名设置必须是VUE_APP_ 为前缀； 且设置好之后，要重新serve才起作用；
3. 系统获取服务器时间； 长时间运行，渲染出现抖动；（每五分钟获取一次服务器时间，5分钟的间隔时间内，进行web的自动+1(时间戳来处理) 来处理时间）
一开始运行的很好，没过多长时间 就开始抖动； 后百度知道，有个词叫定时器防抖动； 定时器嵌套的问题中，在下一次轮询开始的时候，把之前的定时器都清除掉；
代码如下：
async set_serve_time(){
clearTimeout(this.servetimer);
clearInterval(this.timer_auto); //定时器防抖
const result = await getServeTimeApi();
if(result.meta.status == 200){
let data = result.data;
this.$store.commit('setServe_ymd', data.split(' ')[0]);
this.$store.commit('setServe_hms', data.split(' ')[1]);
let data_stamp = Date.parse(data) / 1000; //日期转为时间戳(s)
this.timer_auto = setInterval(() => {
data_stamp = data_stamp + 1;
let data_format = dateFormat_one(data_stamp * 1000, 'yyyy-MM-dd hh:mm:ss'); //时间戳转日期
const [time_ymd, time_hms] = data_format.split(' ');
this.$store.commit('setServe_ymd', time_ymd);
this.$store.commit('setServe_hms', time_hms);
}, 1000);
}else{
clearTimeout(this.servetimer);
clearInterval(this.timer_auto);
this.$store.commit('setServe_ymd', '-');
this.$store.commit('setServe_hms', '-');
}
this.servetimer = setTimeout(this.set_serve_time, 5 * 60 * 1000);
}
4. 失焦事件与enter事件 在运行的时候会发生重叠！！ 一定要想到这个问题，避免跳坑。
我费劲心力写了一个时间的全键盘操作的控件，然后在双击进入修改事件之后，enter 键退出编辑时，怎么都不起作用，后检查好久才知道原来与 blur 事件相互抵消了。救命
5. 表格行的编辑的时候，进行保存。 如何更新表格的data 数组
这是个很简单的功能，我之所以写这个是因为我一直以来都是用 ：
根据列的ID 去找到 data数组的index ，然后根据 写的公共的 根据数组索引，来删除数组的公共方法，去删除data 数组原有的row 然后替换成新的row ; (是不是有点蠢）
后来我才知道，原来可以使用 this.$set(tabledata, index, row) 一行解决！！！
6. 动态路由与权限，其实说起来没有啥，就是结合store 然后根据后台反馈的权限菜单，把权限list存到store 中去； 在路由里进行循环，根据path 字段，来一一对应好路由信息，增加到路由中去； 然后把权限list 给到 导航栏组件，进行渲染。
7. element ui的table 排序 sortable ， 用起来十分方便，但是有隐藏的坑，排序只是表面排序，没有给表格的data数组对象排序。
我在排序之后，点击删除行操作，删除的是其他的行，是因为现在data 数组对象中的行的index 与排序之后的 顺序不一致了，所以此时，完成不能对表格数值进行操作。否则就一定是错的。 所以，奉劝大家一句，修改行数据，用行ID做为定位标识去操作data中的数据。 确保万无一失。
8 双击切换表格中的时间控件 与 文本
问题7 是我在写双击切换时间控件与text 文本遇到的问题，所以代码贴上
<el-table-column label ="开始时间" prop ="StartTime" width ="120px" align="center" sortable>
<template v-slot ="scope">
<time-picker
v-model ="scope.row.StartTime"
v-if ="scope.row.isSelected && dbclickcellname === 'start_time_ref'"
format ="HH:ii:ss"
inputType ="text" size ="small"
@blur ="timepicker_blur(scope.row, scope.row.index)"
ref ="start_time_ref"
@keyup.enter.native ="enterEvent(scope.row, scope.row.index)"
@change ="save_btn_change_event()"></time-picker>
<span class ="" style ="font-size: 20px;"
@dblclick="cellClick(scope.row, scope.row.ID, 'start_time_ref')" v-else>
{{getTime_standant(scope.row.StartTime)}}</span>
</template>
</el-table-column>
// 双击单元格 methods中
cellClick(row, ID, refval){
if(this.table_modify || row.base_state_used) return false；
this.dbclickcellname = refval;
row.isSelected = !row.isSelected;
const indexVal = reArrIndex(this.tabledata, 'ID', ID);
if(indexVal !== -1){
this.$set(this.tabledata, indexVal, row);
}
this.$nextTick(() => {
this.$refs[refval].$refs.input.focus();
});
},
时间控件time-picker是自己写的，因为element ui 自带的时间控件，无法实现全键盘操作进行时间修改。所以自己写了个全键盘操作的时间控件。利用给row增加一个isSelected 字段去控制显示和隐藏； 以及用ref字段去区分同一行的 其他的时间控件（我这个表格中还有一列 时长 ）
8. 在切换路由，退出登录的时候拦截页面的保存状态
可能是对路由了解的不够透彻，在做一个页面的保存按钮状态拦截的时候，我走了很多的弯路，效果做的还不尽人意。最后查资料得知vueRouter有个自带的函数beforeRouteLeave 用来做路由的拦截
在你需要拦截保存按钮状态的页面写上如下代码
beforeRouteLeave(to, from, next) {
if (!this.savebtn_flag) {
this.$confirm('是否保存当前对任务单明细的修改内容？', '提示', {
confirmButtonText: '是',
cancelButtonText: '否',
type: 'warning',
cancelButtonClass: 'btn_confirm_cancel_one',
confirmButtonClass: 'btn_confirm_sure_one',
distinguishCancelAndClose: true, // 重要，设置为true才会把右上角X和取消区分开来
}).then(async () => {
// 是的话 则保存后弹出保存成功提示再确定离开页面。
await this.save_true()
next();
}).catch((e) => {
if(e == 'close'){
next(from.path);
}else if( e == 'cancel'){
next();
}
});
}else{
next()
}
},
其中，this.savebtn_flag 是保存按钮是否可用的标识； 把此函数放到与methods同级中。
还有退出登录的监听，这个问题我也是处理了半天，因为退出登录先走了接口，导致这边beforeRouteLeave即使是监听到了，用户点击确定保存，到时候也走不了保存接口了，因为，token已经清空了。为了解决这个问题，最后，我把要走的退出登录接口函数，放在了destroyed 去执行，等到页面上东西都执行完毕后，再执行退出登录。完美解决
9. textarea框如何识别换行符
这个不要用<br /> ,识别不了html , 换成 \n 即可
遗留问题
1. 我在做页面保存按钮的全局监听的时候，我是写在watch中的对表格的data数据（二维数组对象）进行深度监听变化，但是后来我发现，这个data数据中有些字段，比如 STATE 状态字段，是实时变换的，但是这个字段的变化，我不能让watch监听到。像这种对二维数组进行监听，但是部分属性不监听，这个怎么实现呢？？？？
先到这，之后再补充吧