记录前端工作中获得的经验(二)

2023-12-18 15:57:24 浏览数 (2)

1.一定一定要好好看组件库的api,而不是觉得自己基本会用就完事了,在实际工作中想要的效果往往和官网上的范例有出入,要学会用插槽,用他提供的api自定义内容。

2.注意类名的命名,遵循B__E--M的原则。

3.各种命名都一定要清晰,让人看得明白这是干嘛的。

4.antd要给a-table设置rowkey值,在使用表格时如果页面一直报错,看下是不是表格组件加了scroll的属性的原因,第一种方法是去掉这一属性, 第二种方法是给这个表格一些数据。

5.当使用的组件库和实际需要的效果不同时,就想些奇怪的办法,自己修改掉样式什么的。

6.如果在项目中使用的是pnpm,那就一直统一用这个,不要npm和pnpm混用!!!不然下载的依赖可能会有问题的。

7.import和const定义变量之间最好空一行。

8.记住安装依赖时-S和-D的区别, -S就是打包时也需要的依赖,即dependencies下的依赖,-D就是只有开发时才会用到的依赖,就是devDependencies下的依赖。

9.不乱嵌套div标签, 也不要加一些没用到的类名,不要滥用flex,没用的样式记得删掉。一定要规范代码的书写!

10.在项目中删除node_modules这个文件夹,可以试安装一个rimraf来删除。

11.如果在使用vue2的data时,最好使用data(){return{}}的形式而不是data:{}。因为这里存在对象引用的问题,会造成数据的污染,另外在vue3中,只能使用返回对象的函数形式了,不能使用对象方式了。

12.组件要用name命名,开头大写。如果是vue3的setup语法糖形式,那就用defineOptions来写,记得引入一下。

13.如果项目中有多个子项目,那就cd进入到单个的项目中然后就pnpm或者npm运行,第二种方式是pnpm --filter name(就是子工程的package,json的name) dev。记得如果是npm的话要加run,但是pnpm不用。另外如果是安装的话,npm是install,pnpm是add。

14.工作中遇到一个情况就是,我们公司有自己的依赖包,公司的另一个项目依赖于这个包,如果要使用这个包的话,可以使用npm上传,然后在项目中安装,但是这样很麻烦,因为我们写的依赖包要是有改动,就得重新上传了,所以我们选择软链接的方式。首先将在我们的依赖包项目中输入npm link,将这个包软链全局,让我们的项目可以用它。软链好以后,在我们的项目中就可以npm install 包名安装了,这个时候我们可以看到我们的node_modules中的依赖包有一个快捷方式的标志,说明他们指向同一个引用,只要我们的依赖包内容发生了改变,我们的项目里的依赖也是会同步改变的。

15.使用scss时想要修改vant中的原本样式,可以使用::v-deep,不能使用/deep/会报错,如果是less的话两种都可以,CSS的话使用>>>

16.清除浮动的方法请一定要记住,我们vue2写移动端的话会用flex, 写PC项目不怎么用flex,所以还是会用到浮动的,如果想要清除浮动的话第一种就是给父元素添加overflow:hidden属性,第二种就是给子元素的最后加上一个空的元素,然后给这个空元素添加clear:both,display:block,visibility:hidden的属性。

17.如果发现用js或者在行内样式给元素添加transition属性不生效,但是在style中生效的话,试试把style中的scoped删掉。好像是因为hash的原因。

18.如果你发现你在{{}}写的东西渲染出来以后前面总是有莫名其妙的间隔,看看是不是因为换了行。

19.vue2中经常使用mixins,...mapState之类的,vue3使用的是hook,状态管理用的是pinia而不是vuex。git一定要好好学!!!一定要熟练的掌握在多人协同开发中的git使用,我后面学熟练以后写一期。

20.在gitlab还是其他托管平台添加分支以后,在本地项目中记得git fetch一下,获取最新的分支信息。

21.注意background的复合属性的写法, position一定要写在size属性前面,写成类似center/cover的格式。

22.昨天遇到一种情况,就是我要在轮播图中展示数据,一共八条数据,一页展示四条,然后我就在想怎么做,主管叫我可以使用lodash的chunk方法,可以将数组变成一个二维数组,还可以添加一个参数,决定你的二维数组要以几个元素为一组。

23.勤能补拙,不会就下班之后好好学,除了能力之外,态度也是非常非常重要的,想提升能力就得好好学,多问多思考,不会就问,能得到许多意外的收获。

0 人点赞