实习-代码优化

1、代码规范 ESLint 与 Prettier配合使用

eslint 凡是重复性的工作，都应该被制作成工具来节约成本。
1、语法规则：组件名为大驼峰
2、.native已经被vue3弃用
3、引入必须完整
4、双引号
5、VSCode 保存时自动ESlint格式化
6、v-for 必须有:key
5、注释，跳过此行不检查
// eslint-disable-line

npm run lint 检查语法

2、$cookie全局使用

使用provide和inject配置全局
在要使用的组件中  let cookies:any = inject("$cookies");

vue自带的包 js-cookie

3、ts

！非空断言操作符

 ?: 来表达可选参数

3、自定义指令 nomoreclick

directives 局部 directive 全局

对按钮添加指令防止用户频繁点击，也可以使用防抖节流来操作

4、自定义组件 el-table二次封装

对el-table和el-pagination二次封装，减少标签的代码量，用slot自定义头部

(119条消息) Vite + Vue3 + Ts 《企业级项目》二次封装 el-table、el-pagination、el-tooltip、el-dialog_el-tooltip dialog_彩色之外的博客-CSDN博客

v-if 和 v-for 正确使用：将数据用计算属性computed计算之后再v-for

子组件调用父组件的方法
1、在父组件正常绑定事件，并定义实现方法
2、子组件调用一个方法，这个方法里面emit父组件中的事件

5、高亮显示关键字 v-html

6、nprogress 进度条

7、空格转换

js->html
\n-><br>

8、日期范围变量由外部导入 避免三个页面写重复的代码