vue下前端项目构建总结

大原则:

  组件的复用性

  数据业务分离

  利于团队协作

  

1:组件的复用性不仅仅体现在单个通用型组件的编写(如常见的日期控件,表格控件),他还包括强业务相关性的组件编写,强业务相关性的组件编写,虽然不能用于其他项目,但是在大型项目内部经常可以得到复用,前提是强逻辑相关性组件中必须将业务抽离出来,具体来看,.vue组件将暴露出具体业务方法和接收具体格式的业务数据,以达到具体的业务目标,

  如:

    

在这种业务场景中,我们可以将该模块编写为一个vue组件,vue组件中执行具体的添加 删除条目逻辑,然后暴露出数据模型 向外传递用户填写的值,那么在下次具有类似的使用场景的时候,可以直接拿来使用。

2:数据业务分离:

  将所有与服务器端进行交互的请求统一放在一个地方,并尽可能的将数据的类型判断也放在该模块中,我们暂且把该模块叫做数据端,则数据端负责处理与服务器端的数据交互,并负责判断数据的准确性:

  如在本例中:我们将所有aciotn的接口统一在一起,并提供具体的接口说明:

    

    而在接口中负责具体的数据交互,这样我们成功的把数据和界面进行分离。

    3:利于团队协作

      利于团队协作需要很多地方做出规范,在上面中 我们将业务逻辑分离成一个个通用的业务性组件,我们把数据和界面进行了分离,而在编写数据端的时候必要的注释也可以有利于团队间的协作:

        下面是一个服务器端请求文件的事例:

      

      通过上面三种方式再加上vue-router,我们可以很轻松的编写出一个大型项目,团队中有的可以专门负责编写数据端,有的可以专门负责编写业务性组件,有的则负责搭建整体框架

猜你喜欢

转载自www.cnblogs.com/mrzhu/p/9118050.html