写前端移动端页面遇到的问题

写前端页面遇到的问题

1.元素间的距离还有整行平铺居中的问题

移动端的px都是经过计算的，在设置整行平铺居中的时候，不能直接定死盒子的宽度width，应该用父级padding设置左右的padding，然后子元素设置width：100%

还有元素之间的距离，能用padding就用padding，尽量不要用margin，

2.图标与文字间的距离

图标与文字间也要有一定的间距，不能直接一个img和span标签就完事，span应设置padding-left

3.组件封装的思想

封装组件的逻辑尽量简单，能够通用，逻辑过于复杂的话难以维护。当一个模块过于大的时候，就封装组件去使用

4.echarts图表

radar雷达图的tooltip与其他图标不同，难以更改列表项前面的小圆点颜色。

radar雷达图的指示项名称axisName无法用formatter去引入div这类模板字符串，只会返回一个字符串内原有的内容。目前原因尚未得知。

5.if else

不要用过多的if和else，如果过多，改起来需要先理清逻辑，大大增加工作量，如果避免不了过多的if和else，可以使用映射关系做

6.数据量大小不明确时

在不确定循环遍历生成的列表的数据量时，不能将父容器的高度定死，因为每个手机的分辨率不同。

每个循环遍历生成的item，上下都要设置一定的padding，避免内容靠近边框。
同时也要设置min-height，避免数据长度过短时，盒子高度太低，视觉效果不好。