reactjs - React 的 Bootstrap 与 Material UI？

Question

我一直在我的项目中使用这两种组件，有时我发现需要在引导组件中使用 Material UI 组件，并且 UI 按我的预期显示。但有人建议我不要使用这种方法。既然两者都使用网格并且可以弯曲，有什么原因吗？

Answer 1

我倾向于冗长，所以我将简洁的答案放在此处:

结论:

Whoever said it was bad to use both might just be expressing their opinion, in reality saying it's bad to use both really lacks context in what you're designing. @user3770494 made a very good point- but the point, while valid and truthy about the build size, it does depend on the scope of the application. If it's an intraoffice application with everyone on a fiber network local it'd all be cached in memory anyways... but (not that you know me) I would not judge you negatively if you mixed them together-- unless it was for a MAJOR million user application to run on mobile (an very low devices), desktop, and other devices around the world requiring real(ish) time updates, and streaming dynamic content with 10000s of active users at any givin time 24/7.

In all truth- if it's not life or death-- I'd say use both- and also do your own. The experience of understanding more then one thing is better then just "committing to a single solution" for personal growth.

<小时/>

本文的其余部分是可选的 - 不客气:)

我个人在生产应用程序中使用过这两种方式(同时使用和独立使用)...我也从头开始完成这一切...(CSS 是我最不喜欢的部分我所做的工作事情 - 幸运的是我有一个擅长这件事的同事)这是我的想法:

警告:我倾向于冗长。

免责声明:

作为一个喜欢功能胜于形式的人，形式是事后的想法，对于客户询问细微的小变化来说是不挑剔的。我将尽力留下我对“每个选项的感觉如何”的看法。

另外，我正在我正在做出的当前选择中查看您的问题 - 这是使用 ReactJS/create-react-app 为触摸屏嵌入式系统制作“演示”项目 - 所以我将推出一半十几个用于演示的模拟程序，但没有真正做任何事情(CCscanner、条形码扫描仪、GPS、网络摄像头集成，诸如此类的有趣的东西)。所以我正在研究什么对我来说是最容易做出 promise 的“因为我很无聊并且有一个 pi3b+board 来娱乐”。

答案:

• 如果您有时间、奉献精神和资源，确实有将它们混合在一起并没有什么问题。但你只需要思考关于它的时间/成本/ yield 。 DIY 让最终用户满意-即使你混合它们。完全是你自己在重新造轮子——但是你总是可以引入 boostrap 样式等。

• 固有的风险是，如果您同时使用两者，请确保不要“混合”它们太多，因为这样您在尝试时总会遇到问题永远不要对其中任何一个进行版本更改。

• 我喜欢很多 MaterialUI 的东西，但老实说，我不喜欢一些东西的外观(默认情况下风格明智)——功能上我更喜欢它然后是 bootstrap，但同时，我不喜欢 MaterialUIs React编程风格(作为一个讨厌 CSS 但知道有多重要的纯粹主义者它是-必须使用!永远重要......是很大很大很大nonononononononon)与我和我的同事使用的任何方式相比用于 session 。没有说它比我自己的更好或更差偏好-但有一些事情确实让我很恼火(即使它们是这样做是有充分理由的)。

• Bootstrap 有很多用途可供选择 - 我喜欢它看起来更好，我喜欢它更好地与 ReactJS 配合使用 - 但有Reactstrap 与 React-Bootstrap (这就是为什么我发现你的帖子尝试找出我正在做的演示中使用哪一个)。

• 最近(对于生产项目)我确实尝试只坚持使用一个，但通常我正在制作功能重于形式的系统。所以他们并不真正关心 UI 元素，而是关心如何使用它并不使它变得漂亮。所以我坚持使用单一的只是为了让我的工作更轻松 - 通常仍然会自己覆盖样式...如果原来的风格惹恼了我。但我不坚持其中之一因为“同时使用两者是不好的形式”我只是坚持使用其中一个原因如上文所述。我实际上会说如果带宽不是一个问题-使用两者都是好的-但只使用其中的部分你实际使用的。

(我注意到有人曾经导入完整的 jQuery，而他们从中使用的唯一东西是 $.ajax(尽管很多，但仍然如此)...我当时想...这不是矫枉过正吗？!) - - 因此，如果您同时使用两者并希望保持精简 - 只需确保在编译时仅导入您正在使用的内容。从 Python 角度来说，我是说——永远不要使用 import * from module(但是你在 Javascript 中将其表达为一个概念——webpack/gulp/whomever 应该为你处理大部分事情)。假设您使用 ES6/7 风格的 Javascript。