无法阅读该物业＆＃39; ReactCurrentOwner＆＃39;未定义的

Question

＆＃13;

＆＃13;

import React from 'react';
import AddOption from './AddOption';
import Action from './Action';
import Header from './Header';
import Options from './Options';
import OptionModal from './OptionModal';

export default class IndecisionApp extends React.Component {

	constructor(){
		super();

		this.state = {
			options: [],
			selectedOption: undefined
		};
		this.handleDeleteOptions = this.handleDeleteOptions.bind(this);
		this.handleClearSelectedOption = this.handleClearSelectedOption.bind(this);
		this.handleDeleteOption = this.handleDeleteOption.bind(this);
		this.handlePick = this.handlePick.bind(this);
		this.handleAddOption = this.handleAddOption.bind(this);
	}

	handleDeleteOptions(){
		console.log('handleDeleteOptions');
		this.setState(() => ({ options: [] }));
	};

	handleClearSelectedOption(){
		this.setState(() => ({ selectedOption: undefined }));
	}

	handleDeleteOption(optionToRemove){
		console.log('handleDeleteOption');

		this.setState((prevState) => ({ 
			options: prevState.options.filter((option) => optionToRemove !== option)
		}));
	 };

	handlePick(){
		const randomNum = Math.floor(Math.random() * this.state.options.length);
		const option = this.state.options[randomNum];
		this.setState(() => ({
			selectedOption: option
		}));
	};
	handleAddOption(option) {
				
		console.log(option)
		if (!option) {
			return 'Enter valid value to add item';
		} else if (this.state.options.indexOf(option) > -1) {
			return 'This option already exists';	
		}

		var len = 0;

		if (this.state.options !== undefined){
			len = this.state.options.length;
		}
		if (len > 2)
		{
			this.setState((prevState) => ({
				options: prevState.options.slice(len - 2, len).concat(option)
			}));
		}
		else {
			this.setState((prevState) => ({
				options: prevState.options.concat(option)
			}))
		}
	};

	componentDidMount() {
		console.log('In componentDidMount');

		try {
			
			const json = localStorage.getItem('options');
			const options = JSON.parse(json);

			if (options) {
				this.setState(() => ({ options }));
			}
		} catch (e) {
			// Do nothing at all
		}
	}
	componentDidUpdate(prevProps, prevState) {
		if (prevState.options.length !== this.state.options.length) {
			const json = JSON.stringify(this.state.options);
			localStorage.setItem('options', json);
		}
	}
	componentWillUnmount() {
		console.log('componentWillUnmount');
	}

	render() {
		const subtitle = 'Put your life in the computer hands';

		

		return (
			<div>
				<Header subtitle={subtitle} />
				<div className="container">
					<Action 
					hasOptions={this.state.options.length > 0}
					handlePick={this.handlePick}
				/>

				<div className="widget">
					<Options
					options={this.state.options}
					handleDeleteOptions={this.handleDeleteOptions}
					handleDeleteOption={this.handleDeleteOption}
					/>

					<AddOption
					handleAddOption={this.handleAddOption}
					/>

				</div>
			</div>

			<OptionModal
			selectedOption={this.state.selectedOption}
			handleClearSelectedOption={this.handleClearSelectedOption}
			/> 
			</div>
		);
	}
}

＆＃13;

{
	"name": "indecision-app",
	"version": "1.0.0",
	"main": "index.js",
	"author": "Nishanth Battula",
	"license": "IIT",
	"scripts": {
		"serve": "live-server public/",
		"dev-server": "webpack-dev-server --env.dev",
		"build": "webpack",
		"build:dev": "webpack"
	},
	"dependencies": {
		"babel-cli": "6.24.1",
		"babel-core": "6.25.0",
		"babel-loader": "^7.1.1",
		"babel-plugin-transform-class-properties": "6.24.1",
		"babel-preset-env": "1.5,2",
		"babel-preset-react": "6.24.1",
		"css-loader": "^0.28.4",
		"live-server": "^1.2.0",
		"node-sass": "4.5.3",
		"normalize.css": "7.0.0",
		"react": "15.6.1",
		"react-dom": "2.2.2",
		"react-modal": "6.0.6",
		"react-watermark": "0.0.3",
		"sass-loader": "^6.0.6",
		"style-loader": "^0.19.1",
		"validator": "8.0.0",
		"webpack": "^3.1.0",
		"webpack-dev-server": "^2.5.1"
	}
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.2/react-dom.min.js"></script>

＆＃13;

＆＃13;

＆＃13;

我有一个小的React App。它已经处于工作状态一段时间了，但是，在添加了一个小功能的代码后，我看到TypeError＆＃39;无法读取未定义的属性ReactCurrentOwner＆＃39;。我在项目中执行的一系列操作是：

• 纱线安装
• 纱线构建（这相当于 webpack ）
• 纱线服务（相当于 liveserver public /）

第一步，即。纱线安装，有几个选项显示选择与React相关的库。我很困惑地选择合适的选项。

如果你们中的某个人可以帮助清除web控制台中的TypeError，那将是很好的，这样我就可以正确地查看应用程序。