React 错误（TypeError）：无法添加属性上下文，对象不可扩展答案

【问题标题】：React Error (TypeError): Can't add property context, object is not extensibleReact 错误（TypeError）：无法添加属性上下文，对象不可扩展
【发布时间】：2015-08-26 21:51:46
【问题描述】：

我正在尝试在 react 组件中使用 react-clipboard，以允许用户轻松地将一些文本复制粘贴到剪贴板，但我的代码无法正常工作。我想知道我是否遗漏了一些明显的东西。这是我的代码（请忽略关闭模式的样板）：

'use strict';
    import React from 'react';
    import { Modal } from 'react-bootstrap';
    import Clipboard from "react-clipboard";

    class CopyText extends React.Component {
      render() {
        let text = JSON.stringify(this.props.value, null, "  ");

        return (
          <div>
            <p>Press Cmd + C to copy:</p>
            <pre>{text}</pre>
            <Clipboard value={text} />
          </div>
          );    
      }
    }

    class CopyLinkModal extends React.Component {
      constructor(props) {
        super(props)
        this.onClick = this.onClick.bind(this);
      }
      onClick() {
        this.props.onHide();
      }
      render() {
        return (
          <Modal show={this.props.show} message={this.props.message} onHide={this.onClick}>
            <Modal.Body>
              <div className="linkMessage">
                <CopyText value={this.props.message} />
              </div>
            </Modal.Body>
            <Modal.Footer>
              <button onClick={this.onClick}>Close</button>
            </Modal.Footer>
          </Modal>
        )
      }
    }

    export default CopyLinkModal;

在大多数情况下，我遵循 https://www.npmjs.com/package/react-clipboard 的指示，但我仍然收到 TypeError: TypeError: Can't add property context, object is not extensible 感谢您的帮助。

【问题讨论】：

你从哪里得到这个错误（行号，堆栈跟踪）？您何时收到错误（编译、执行、用户操作）？
Bergi - 错误源自 ReactCompositeComponent.js:153 - 我在调用堆栈中看不到任何我自己的文件。还有一个我认为相关的警告：（警告：组件（...）：在返回的组件实例上找不到render方法：您可能忘记在组件中定义render，或者您可能不小心试图渲染一个元素，其类型是一个不是 React 组件的函数。）当用户单击一个按钮时触发错误，该按钮本身会触发模式显示（父组件状态更改为 true）。
嗯，您是否检查了所有导入是否按预期工作？
剪贴板是我最近添加的唯一模块...没有它，应用程序可以正常工作。有可能是它的错误或 ES6 语法存在一些问题。
我看到你正在使用 ES6 类。我的猜测是 react-clipboard 使用的 React 版本在此功能之前。尝试在您的组件中使用 React.createClass。

标签： javascript reactjs ecmascript-6

【解决方案1】：

来自react-clipboardpackage.json：

"dependencies": {
    "react": "^0.12.2"
}

因此不支持 ES6 类。

【讨论】：