Question

我练习反应
我遇到了这个错误：Uncaught ReferenceError: ReactDOM is not defined
在Chrome控制台上输入ReactDOM.unmountComponentAtNode(document.body)时

请帮我查一下问题我在JSbin上尝试代码并运行良好，所以我认为这是webpack问题，但我不知道。

我注意到谷歌有很多方式写React.render部分，有什么区别？哪一个是正确的？

React.render(<App name='Vipul' />,document.body); 
ReactDOM.render(<App name='Vipul' />,document.body);
React.renderComponents(<App name='Vipul' />,document.body);

这是我的代码：

main.jsx

import React from 'react';
import ReactDOM from 'react-dom';

console.log('Start')
var App = React.createClass({
  render: function(){
    console.log('render');
    return <h1 onClick={this.toggleState}>Hello</h1>
  },
  componentWillUnmount: function(){
  //在console執行 ReactDOM.unmountComponentAtNode(document.body)
    console.log('componentWillUnmount');
  },

  toggleState: function(){
    this.setState({status: !this.state.status})
  }

});

ReactDOM.render(<App name='Vipul' />,document.body);

webpack.config.js

var WebpackNotifierPlugin = require('webpack-notifier');

module.exports = {
    entry: "./src/main.js",
    output: {
        filename: "./dist/bundle.js"
//        filename: "./public/dist/bundle.js"
    },
    plugins: [

    new WebpackNotifierPlugin()

  ],
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                loader: "babel-loader",
                query: {
                    presets: ['es2015', 'react']
                }
            }
        ]
    },devtool: 'source-map'
};

Answer 1

ReactDOM自0.14.0起可用，所以

.product-title {
  text-transform: full-width;
}

应该没问题。如果你使用的是较低版本的React，那么React.render

其次建议不要在document.body上渲染，而是在body中创建一个div并在那里渲染。

我遇到了这个错误：未捕获的ReferenceError：未定义ReactDOM 在chrome控制台上键入ReactDOM.unmountComponentAtNode（document.body）
时

当您使用Webpack时，React和ReactDOM将无法全局使用。因此，此代码仅适用于已导入React＆amp;的文件/模块。 ReactDOM。

Answer 2

只有一种方法可以在浏览器中呈现React组件，就是这样：

if(!strcmp(user->MyClass->name.c_str(),"user")

已弃用所有其他内容 - ReactDOM.render(<App />, target);已重命名为renderComponent，并已从render包转移到react包。

此外，您是否需要在react-dom生命周期方法中致电unmountComponentAtNode？在你的特定情况下它没有意义。 React将为您卸载组件 - 免费。

componentWillUnmount通常用于清除超时/间隔和/或取消异步操作（Promises，关闭连接，......）;

删除该通话不会对您造成伤害，请尝试一下。

ReactDOM.unmountComponentAtNode：未捕获的ReferenceError：未定义ReactDOM

2 个答案: