vue之组件（一）

这大概是小白提升工作效率必须要弄明白的几个问题：

什么时候模块应该拆成组件？

什么时候应该将不同状态的模块写在同一路由中？

什么时候应该将不同状态的模块写在不同的路由中？

• 什么时候页面模块应该拆成组件？

  页面模块拆成组件是为了更好的复用重组，只要是可能第二次出现的页面结构就可以拆成组件。

• 什么时候应该将不同状态的模块写在同一路由中？

1、一个页面在不同状态下展示的模块不一样而已，通过不同状态控制不同组件的显示，或是后面显示的模板不需要通过按手机上的返回按钮返回到前一个模板的时候。

什么时候应该将不同状态的模块写在不同的路由中？

1、业务具有多个不同状态，不同状态的页面需要独立（后一个页面可能需要返回到前一个页面），或是需要的数据都在一个接口返回的时候（不同页面的路由由父路由来分发）

比如一个选择题作业的需求，页面有三个状态：做题页，提交了答案的结果页，解析页。前端所有需要的数据都在一个接口中获取。

不好的写法是：在做题页请求接口获取到所有的数据，然后将数据存在localStorage中，后面的结果页、解析页需要数据就从localStorage或sessionStorage中获取；这样有很大的弊端就是缓存中存的数据存在被覆盖的风险或退出页面之后如果直接进读sessionStorage的页面会获取不到数据，这也是有可能的如果有一个需求是，这个页面可以分享出去，然后用户可以直接进这个页面的话。

可以满足需求的可执行的写法： 三个页面都去请求一次获取数据的那个接口，这样无论如何都可以保证可以去请求数据。

最好的写法：利用vue-router中的父子路由来做

image.png

获取数据只需要要第一个页面去请求接口
未完待续...