我想要一些有关 React 组件使用的建议/意见。
当网站的桌面版和移动版(不是应用程序)面临两种不同的设计时，您是否使用相同的组件并使用媒体查询或 JavaScript 窗口大小等修改各个部分，或者您是否在需要时创建不同的组件如果是移动网站，渲染效果会有所不同吗？
您使用过的任何策略以及您的经验/意见都会有很大帮助。许多不同的人将不胜感激!
谢谢!
最佳答案
我会使用响应式设计的网络标准和 Bootstrap 或基础等库。除非您针对不同的平台(例如 native 与网络)，否则无需编写不同的 View 。这将节省您的时间和精力，因为您从编写不同的组件中获得的 yield 并不大。
也就是说，如果某些特定页面需要使用完全不同的 UI 来提供更好的服务，您可以将两者混合使用。简单地创建两个包含大量文本的主页没有任何优势，这个问题已经通过响应式设计实践解决了，不利用它们就是一种倒退。
还要尽可能地利用组件重用。如果桌面共享 5/6 功能，则以某种方式编写 5，它们可以以不同的方式缩放以进行粉碎并编写 6 的两个版本。
我不会说这两个选项是相互排斥的。尽可能利用响应式设计实践，并尽可能利用 React 的组件化。如果您发现自己不确定该走哪条路，则可能意味着使用响应式设计(恕我直言)。
我设计的应用程序的目标是真正不同的平台。我们希望 native 和网络并存。您正在寻找的是一个中间立场，因为许多组件可能会共享，但少数组件可能需要不同的功能，从而需要不同的组件。我见过两种应用程序结构，一种按类型(例如组件与容器)组织应用程序，另一种根据页面结构(索引、帐户、登录、共享)组织代码。我发现，当需要混合完成相同功能但针对不同平台的组件时，最好按页面结构分开，就像在索引页面中一样，我可以在需要时简单地并排放置一个 iOS 索引和一个 Web 索引。这使我能够拥有两个无状态组件和一个阶段容器来为它们提供动力。对于较大的应用程序来说，这在心理上也更有意义，并允许您做更多您想做的事情。
总的来说，如果您需要使用 if 语句来隐藏和显示功能，请考虑将其分解为可重用的组件，并创建由单状态完整组件提供支持的移动和桌面演示组件。
关于javascript - 最佳实践 : react components on mobile version of site，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42122255/