javascript - 如果我开始使用 React/flux，是否应该从头开始重新创建所有页面(html 和 css)？

Question

我已经构建了我的应用程序的几个页面。因为我需要一个 javascript 框架和次级动态页面，所以我想我会尝试 React/Flux。

尽管阅读了很多书，但我还是不完全理解你是否可以保留我现有的代码库(html/js)并且只在需要与数据库交互的网页的某些 block 上使用 React(jsx，模块)/动态实现？

举个例子:我的页面有很多东西:bootstrap 我调整了很多(使用 css)实际上在幕后使用 javascript/DOM ex 用于下拉菜单和其他东西)，respond.js 用于在 ie8 上启用媒体查询(我猜使用DOM)，以及许多第三方工具，如 intercom.io 甚至屏幕底部的谷歌分析 js 跟踪窗口。你可以在这里看到页面的样子。

我的需求:我只需要 block (D)上的动态调整和实时功能，所有其他的，标题(B)，对讲机(C)和其余部分可以保持原样，这会节省我一些如果我可以将它们保留在当前的 html 代码中，还有很多时间。

所以这是我的问题:

• (1) 我是否必须转换页面上的所有内容才能使用react，或者只放入 jsx/react block (D) 并保持其余部分不变？

• 关于 (1) 我想利用 React 带来的主要优势(虚拟 DOM 和差异)，即使整个页面不在 React 上，我仍然可以使用它吗？

• 如果答案基本上是“全有或全无，你必须在 React jsx 中全部完成并重做你的整个页面”，转换你的 html 并找到所有使用 DOM 的 js 脚本的替代品例如下拉菜单、灯箱、intercom.io 脚本、谷歌分析脚本那么难吗？我的意思是或者我可以保留 css 并使用它来更改 html http://facebook.github.io/react/html-jsx.html ？这真的很容易，但我担心这里有一个陷阱...:)

Answer 1

就应用的 View 层而言，一切都可以用 React 完成(是的，react 可以做你需要的一切)

我建议的第一件事是前往 React 网站获取文档，使用 Google 和 YouTube 做一些教程，然后开始使用 React 但不完全是。 (使用 JSX)。

因为您现在了解 React 的工作原理以及如何使用 props 和状态，您最终可能会一次合并应用程序的片段。

要考虑的最重要的事情是上下文。 React 是简单的 Javascript，因此您可以绑定(bind)、调用和应用现有应用程序中的任何对象。

var blockA = React.createClass~
    blockB = React.createClass~
    blockC = React.createClass~
    blockD = React.createClass~

React 只是组件，每个 block 都是一个组件。

不过我不能再强调了，理解react的基本原理，一点都不难。

编辑...

是的，使用 JSX，我最初认为它很愚蠢，但它非常棒!

对于 DOM 操作，它是全有或全无。 React 使用它的 DOM 副本来更快地操作实际的 DOM。对于不接触 DOM 的代码部分，它不会在 React 中产生巨大差异，但 React 有一个漂亮的工作流程，可以将状态更改传递给它的子组件。这真的取决于你，但如果你正在使用 React，那么在 React 中做所有 DOM 的事情。您尝试执行的操作中有 70% 以上可能是 DOM 操作。

总的来说，我的建议是，不要想太多它会有多“难”。想想你能多快学习基础知识。它很容易掌握。