ReactJs浏览器无法读取未定义的属性“键”答案

【问题标题】：ReactJs browser Cannot read property 'keys' of undefinedReactJs浏览器无法读取未定义的属性“键”
【发布时间】：2016-07-05 02:56:56
【问题描述】：

HTML 代码：

<div id="content"></div>

<script src="build/react.min.js"></script>
<script src="build/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-core/6.1.19/browser.min.js"></script>
<script src="ex1.jsx" type="text/babel"></script>

JSX 代码：

// create class
var HelloWord = React.createClass({
    render: function () {
        return (
            <div>
                <p>Hello Word!</p>
            </div>
        );
    }
});

// show content
ReactDOM.render(
    <HelloWord></HelloWord>, document.getElementById('content')
);

运行后的控制台消息：

未捕获的类型错误：无法读取未定义的属性“键”

为什么？

【问题讨论】：

有和你类似的问题可以找here
第 6 版根本不适合我。
babel版本必须小于6.0.0

标签： javascript reactjs

【解决方案1】：

我也遇到了同样的问题，在上网时我发现我使用的 babel-core 版本有问题。我用另一个替换它并让我的代码工作。

试试这个

HTML

<div id="content"></div>

<script src="build/react.min.js"></script>
<script src="build/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js"></script>
<script src="ex1.jsx" type="text/babel"></script>

JSX

var HelloWord = React.createClass({
    render: function () {
        return (
            <div>
                <p>Hello Word!</p>
            </div>
        );
    }
});

// show content
ReactDOM.render(
    <HelloWord></HelloWord>, document.getElementById('content')
);

它也应该适合你。

更新：

由于babel-browser 是deprecated，因此您可以使用babel-standalone 包进行babel 编译和更新版本。

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script>

【讨论】：

我刚刚遇到同样的错误，发现我们使用的浏览器的 Babel 版本已被弃用。您可以在浏览器中使用的最新版本是cdnjs.com/libraries/babel-standalone
确实适用于您更新的答案。感谢您的支持。