node.js - 这个react用webpack打包后的问题

Question

用React写了段代码其中App.jsx大部分是直接照扒React-UI-Tree这个组件的，用webpack编译打包后浏览器回应了这么个错误，代码应该是没问题不知问题在哪0.0

图一左侧代码：

import ReactDOM from 'react-dom';
import cx from 'classnames';
import React from 'react';
import Tree from 'react-ui-tree';


export default class App extends React.Component {

  constructor() {
    super();
    this.state = {
    active : null,
    tree : {
      "module": "react-ui-tree",
      "children": [{
        "collapsed": true,
        "module": "dist",
        "children": [{
          "module": "node.js"
        }]
      }]
    }
    };
  }

  renderNode(node) {
    return (
      <span className={cx('node', {
        'is-active': node === this.state.active
        })} onClick={this.onClickNode.bind(null, node)}>
        {node.module}
      </span>
    );
  }

  onClickNode(node) {
    this.setState({
      active: node
    });
  }

  render() {
    return (
      <p className="app">
        <p className="tree">
          <Tree
            paddingLeft={20}
            tree={this.state.tree}
            onChange={this.handleChange}
            isNodeCollapsed={this.isNodeCollapsed}
            renderNode={this.renderNode}
          />
        </p>
        <p className="inspector">
          <button onClick={this.updateTree}>update tree</button>
          <pre>
          {JSON.stringify(this.state.tree, null, '  ')}
          </pre>
         </p>
      </p>
    );
  }

  handleChange(tree) {
    this.setState({
      tree: tree
    });
  }

  updateTree() {
    var tree = this.state.tree;
    tree.children.push({module: 'test'});
    this.setState({
      tree: tree
    });
  }

}

Answer 1

把你this.state.active的源码贴出来，编译后的真心不想看，看完也没法给你说问题

render改一下：

render() {
    return (
      <p className="app">
        <p className="tree">
          <Tree
            paddingLeft={20}
            tree={this.state.tree}
            onChange={this.handleChange}
            isNodeCollapsed={this.isNodeCollapsed}
            renderNode={this.renderNode.bind(this)}
          />
        </p>
        <p className="inspector">
          <button onClick={this.updateTree}>update tree</button>
          <pre>
          {JSON.stringify(this.state.tree, null, '  ')}
          </pre>
         </p>
      </p>
    );
  }