如何判断何时创建新组件?

Kor*_*rte 9 functional-programming web-component reactjs vue.js angular

我一直在寻找有人在angularjs/angular上的web应用程序中创建新组件的逻辑,但我想这更通用,可能适用于所有基于组件的前端框架.

我知道有一些原则,例如它应该是抽象的和可重用的,但是我已经在角度文档上看到每个单独的路径都看着一个特定的组件(这怎么可以重用).在创建新组件之前,我可能会问一些可靠的问题吗?

teo*_*ter 11

为了决定是否必须创建组件,我认为您必须回答以下问题:

  1. 您的代码块是否可以重用?如果是的话,构建一个新组件似乎是一个好主意.
  2. 你的代码很复杂吗?如果是,也许最好分成不同的组件,以使您的代码更易读和可维护.


dan*_*y74 7

无论框架如何,此建议均适用.通常会出于以下两个原因之一制作新组件:

(1)可恢复性

您将重新使用此组件.重复使用水平各不相同.某些代码可能是项目特定的,但可能在项目的两个位置使用,但永远不会在项目之外使用.它仍然可以重复使用.

但是,如果它是一个高度可重用的代码片段,你应该真正改进它,并可能将它发布到世界各地!

(2)组织

有时代码可能会持续太长时间.可能有数百条线路,它只是不可读.将代码分解为组件有助于提高可读性和代码组织.这里,新组件应该是父组件的子组件.

代码结构:

您应该考虑将高度重用的组件放在名为components的文件夹中.可以作为第三方库的一部分的组件.

将可重用组件项目放入名为apponents的文件夹中.

最后,组织组件应该是其父组件的子组件,并且应该放在其父组件的子文件夹中.


Saj*_*ran 5

在决定编写新组件之前请按照以下步骤操作,

(i) Identify the responsibility- 您应该components responsibility在编写之前定义 a,这样您就知道何时开始编写。

(ii) When it is large- 根据经验,如果您的组件代码超过 600 行,请分成更小的组件,这使您的代码易于阅读和维护

(iii) When you want to reuse- 当您发现某个组件被多个模块使用时,您应该将其设为共享组件。

上述 3 条规则将帮助您确定何时需要编写新组件。希望能帮助到你