我想在我的应用程序中使用样式组件,我想知道如何组织它.
基本样式的组件被分配给特定组件以实现可重用性.
但是,我想在其他组件(例如动画组件)中多次使用样式组件呢?
我应该创建一个文件,我将保留这些“全局”样式组件并将其导入许多组件?
这是好习惯吗?
解决方法
这是我使用样式组件构建的大部分大型生产应用程序如下所示:
src ├── App │ ├── Header │ │ ├── logo.js │ │ ├── Title.js │ │ ├── Subtitle.js │ │ └── index.js │ └── Footer │ ├── List.js │ ├── ListItem.js │ ├── Wrapper.js │ └── index.js ├── shared │ ├── Button.js │ ├── Card.js │ ├── InfiniteList.js │ ├── EmojiPicker │ └── Icons └── index.js
App文件夹包含构成更大应用程序的所有特定组件. (您可能通过真实应用程序中的路由构造)每个更大的组件都是一个文件夹,其中包含index.js文件和一些样式组件在单个文件中.
当我正在构建我的应用程序,我注意到,我需要一个更大的组件的样式组件在另一个更大的组件,我将其文件拖到共享/文件夹,更新所有的导入,就是这样!随着时间的推移,共享/成为一个具有所有组件的Improptu模式库,我想/需要在整个应用程序中重用.
如果您有一个大文件(其中包含所有风格的组件)(更不用说该文件可能会很大),那么这种提取有点困难,通过将它们放在单个文件中,您可以简单地拖动它们.