2018-7-10的总结
Posted linququ
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了2018-7-10的总结相关的知识，希望对你有一定的参考价值。
开发工具
1、WebStorm 可以通过Alt+F12打开Terminal
2、WebStrom 里面 Ctrl+Shift+N 按照文件名进行全局搜索
3、VS通过 查看 -> 集成终端查看
4、VS里面可以通过Ctrl+P快速定位到文件
5、按住ctrl再点击可以快速定位到代码引用的位置
命令行
1、Ctrl+C 关闭，结束过程，命令终止
2、npm run dev 启动了Vue项目要在Vue项目的根目录下运行该条指令
CSS
1、css 中white-space：normal 文本中的空白会被忽略，其余的选项还有pre，pre-wrap, pre-line,inherit
2、css中的样式的层级最好控制在三层以内，css选择器是从右开始向左匹配的。要尽量减少不必要的匹配。less也是一样的，嵌套会影响性能
3、样式要尽量采用缩写的方式，比如font可以一个属性定义好的，就不要font-size，font-family等等分开写了。
4、减少 * ，标签 ，多层 等选择器的使用
5、css书写的顺序可以按照：布局-》盒子模型-》背景-》行高-》css3（transform等）-》链接[link,visited,hover,active]这种顺序去写，让人看起来比较清楚
6、少使用绝对定位，能用float就使用float。因为在手机端可能会有一些问题
7、在内容太多超出了范围的时候可以用text-overflow:ellipsis进行设置，让多余的部分变成省略号
HTML
1、图片要加 alt ，在图片无法显示时的替换文本，增加了用户友好度
2、标题要加title
3、form表单要加label，方便点重
4、引入图标
<link rel="icon" href="../../../dist/img/basicimgs/favicon.ico" type="image/x-icon">
JS
1、由于js中的浮点运算存在问题，所以要尽量避免使用浮点运算，避免不了也要尽量减小浮点运算带来的影响，比如放在最后除之类的。
Vue
1、组件（Vue）实例由三部分构成：（1）模板 template （2）样式 style （3）js script
2、slot就是你在子组件里面写。如果父组件没有slot要覆盖的话就渲染子组件的slot。如果父组件有写的话，就会把子组件的给覆盖掉
3、组件在取名字的时候注意不要和保留的名字冲突了，比如frame 就要换一个名字。
4、在子组件里面定义的插槽的样式是会被覆盖掉的，要写在父组件里面。
5、在这个项目中用到的路由方式是history，要去后台配置一下，Vue.js默认的路由方式是hash
6、import HelloWorld from ‘@/components/HelloWorld‘ 中，@ 这个符号，可以代替一个路径，算是一种别名把。nodejs 会把它自动定位到项目的src的位置
是在webpack.base.conf.js里面的resolve：{……alias：{@……}} 配置的
7、如果项目出问题了可以直接把node_modules 删掉，重新编译，因为这个文件里面放的都是存放项目开饭中的依赖模块。
性能优化
1、在切图的时候图片格式保存为web格式，一般来说小图片要尽量保持在30k以内，大图片要保持在100k以内，如果太大，要用压缩软件压缩一下。大图要做成字体库，如果不是色彩很丰富（没有透明度）的图片保存为png8，如果色彩比较丰富（有透明度），要保存为png24，动态图保存为gif格式。
开发相关
1、百分比是相对于父元素的，设计稿给的有时候是对于一整个的页面的百分比，这种情况下可以考虑使用vh，vw等视口单位或者rem，可以减少很多换算
2、如果出现模块的丢失要重新npm install 一下，然后重启项目
3、关于分页：就是把分页的功能实现，不需要考虑数据。只需要把当前页的需要传递到接收数据的那一层组件，就可以了。之后就可以拿着这个当前页的数据去向后台请求数据了。
4、如果数据库里面存储的时间格式是string 。里面包含了日期和时间，要怎么把这两个给拆分出来？
item.create_time.split(" ")[0]//日期
item.create_time.split(" ")[1]//时间
5、单页面应用和多页面应用的区别：
https://juejin.im/post/5a0ea4ec6fb9a0450407725c
以上是关于2018-7-10的总结的主要内容，如果未能解决你的问题，请参考以下文章