电子商务网站建设与维护概述,家庭室内装修设计公司,武威建设厅网站,学校门户网站建设必要性目录
目录
一#xff1a;背景介绍
二#xff1a;思路方案
三#xff1a;过程 问题1#xff1a;代码可读性差#xff0c;代码结构混乱 问题2#xff1a; 代码逻辑混乱#xff0c;缺乏封装的意识 问题3#xff1a;美观问题#xff1a;问题和图标没有对应上
四…目录
目录
一背景介绍
二思路方案
三过程 问题1代码可读性差代码结构混乱 问题2 代码逻辑混乱缺乏封装的意识 问题3美观问题问题和图标没有对应上
四总结 一背景介绍 在项目开发的过程中会出现结构混乱、逻辑编写不清晰、页面设计不美观的问题看似不是什么大的问题但是正是这些细节之处才能体现开发人员的专业程度细节决定成败。下面和大家分享一下开发中的问题下次避免类似的情况发生。
问题1结构混乱可读性差 问题2 逻辑不清晰封装意识缺乏 问题3美观问题图标和问题没有对齐 二思路方案 1.调整代码的整体结构和层次关系让不是此业务的工程师也能一目了然。 2.将相同的模块进行封装而不是写多遍合理使用v-if语句 3.调整前端样式体现我们的专业性。
三过程 问题1代码可读性差代码结构混乱 解决方案添加足够多的注释以及对代码结构进行分层。保证从宏观上让读代码的人一看就看出来整个代码是做什么的 问题2 代码逻辑混乱缺乏封装的意识 解决方案把182、183和191这三个类似的div模块封装成一个组件我们可以通过组件引用的方式再添加对应的v-if 或者v-else的方式进行判断。对于nextActiveIsShow这一个变量的判断可以使用ture、fasle的形式。 问题3美观问题问题和图标没有对应上 解决方案只需要将 img标签与 span标签对齐就可以解决美观问题给 img标签附上样式。
height: 1.5em;
vertical-align: -0.3em;四总结 1.明确概念明确边界。只有我们对v-if足够明确我们在使用过程中才不会出现只使用v-if的情况。对于同一个变量的判断可以使用true和false的方式。 2.封装的重要性我们把类似的代码封装了之后我们代码的复用性才强。在后期维护的过程中才会更加的容易。如果同样的代码写了很多份。维护起来很困难花费时间也长。