Material UI 0.2x 与 React 16 的兼容性答案

【问题标题】：Material UI 0.2x compatibility with React 16Material UI 0.2x 与 React 16 的兼容性
【发布时间】：2018-07-02 17:46:19
【问题描述】：

在尝试从 React 15.4 升级到 React 16.4.1（也将 react-dom 升级到 16.4.1）后，我从路由器收到以下错误消息：

TypeError: _nextProps.children is not a function
    at ReactDOMServerRenderer.render (/var/www/web/node_modules/react-dom/cjs/react-dom-server.node.development.js:2491:55)
    at ReactDOMServerRenderer.read (/var/www/web/node_modules/react-dom/cjs/react-dom-server.node.development.js:2354:19)
    at renderToString (/var/www/web/node_modules/react-dom/cjs/react-dom-server.node.development.js:2726:25)
    at render (/var/www/web/server/routes/others.jsx:141:24)
    at process._tickCallback (internal/process/next_tick.js:68:7)

代码：

const render = () => {
  const body = renderToString(
    <MuiThemeProvider muiTheme={muiTheme}>
      <ThemeProvider theme={theme}>
        <Provider store={store}>
          <IntlProvider>
            <RouterContext {...renderProps} />
          </IntlProvider>
        </Provider>
      </ThemeProvider>
    </MuiThemeProvider>
);

render 在此处定义，但随后在同一路由文件中返回：

Promise.all(prefetchData(renderProps, store))
  .then(render)
  .catch(prefetchError => next(prefetchError));

为了从 React 15.x 升级到 React 16.x，我关注了 recommended instructions

因为我发现了有关 Material-ui 与 React 16 兼容性的相关问题：

https://github.com/mui-org/material-ui/issues/8434

https://github.com/mui-org/material-ui/issues/7795

我想知道这个错误消息是否可能是由于 material-ui 0.2x 和 React 16.x 之间的不兼容引起的，或者换句话说，我想知道是否有必要升级到 material-ui 1.x为了能够使用 React 16.x

【问题讨论】：

我们正在使用 Material-ui 0.18.1 和 React 16.3，一切运行良好。我不认为这个错误是因为 material-ui 2.x 和 React 16.x 之间的不兼容。
虽然那是在客户端，你在服务器端使用renderToString。所以可能就是这样。
github.com/kireerik/… 我发现这个 repo 使用 React 16 在服务器端渲染 material-ui 0.x。所以这绝对不是兼容性问题。
所以不需要将material-ui升级到1.x版本来使用React 16.x。
感谢您的信息，我认为您的第三条评论可以是接受的答案，如果您这样输入 :) 可能是仅与材料 ui 0.2x 中的 MuiThemeProvider 不兼容，但这会我认为超出了这个问题的范围。谢谢！

标签： reactjs express material-ui react-dom react-16

【解决方案1】：

我们正在使用material-ui 0.18.1 和React 16.3 进行客户端渲染，一切正常。我不认为这个错误是因为material-ui 0.2x 和React 16.x 之间的不兼容。

对于服务器端渲染，我发现this repo 在服务器端渲染material-ui 0.x 和React 16.x。所以这绝对是不是兼容性问题。

【讨论】：

【解决方案2】：

我最近的任务是同时支持 MUI 0.x 和 MUI 1.x，虽然这很具有挑战性，但我找到了一种让它发挥作用的方法。

使用 MUI 0.x，我发现可以很好地协同工作的版本是：

material-ui@0.19.4
react@16.3.2 - 升级到 react@16.4 会破坏它，这与小更新中事件的处理方式有关。

要让 MUI 1.x 与 MUI 0.x 一起工作，还需要一些其他配置，但希望这部分足以回答您的问题。

【讨论】：