这是我参与「第四届青训营 」笔记创作活动的第30天

沸点页面分析

在沸点页面中主要由五部分组成，

通用Header组件：

左侧边与右侧边组件：

沸点发布组件：

评论区组件：

通用Header组件

这没啥说的，上篇文章讲过了，导航栏判断route隐藏下半Header分类组件就行。

左侧边与右侧边组件

这是两个固钉组件，在写好样式注入数据后可以尝试引入elementplus的固钉（自己写也可以，反正该组件很好写）。

沸点发布组件

该页面的难点，拆开来说能bb一堆技术点，而且这个发布组件的设计确实写起来比较麻烦，比如说灰色区域并不是直接用textarea来写的，而是拆分成写文章组件，选圈子组件，已经隐藏的上传照片墙组件和手写的计数功能。下方的emoji表情直接遍历数据即可，没啥难点。而对于照片功能来说确实写的比较精妙，上传照片获取数据后传入到一个数组，该数组如果不为空则显示灰色区域的照片墙，并且数组数据与照片墙公用数据，而照片墙也可以塞入数据，当把照片删除后数组也会清除数据，再为空时照片墙将会再次隐藏。链接组件的话已经不再前端服务范围了，这里触及知识盲区，话题也是导入数据即可。

评论区组件

依次遍历数据，这个页面和主页面一样要用无限滚轮来优化。

总体页面布局

说白了，这和主页面的布局和设计是相似的，总体来说都要用到无限滚轮，而页面布局也是常见的三栏布局，较为常见。

想说的一些话

当组件运用相同的时候就把他塞到公共区里，一些功能常用就自己单独封装一个，天天堆屎山也不是个办法。