Question

有一个来自codecademy的非常简单的教程，关于父母将孩子的状态推送到孩子，并使用这个道具来获取孩子们的这个值。这很简单，我理解它，但如果我在我的localhost上复制这两个文件它就不起作用。所以我现在很困惑，教程错了，或者用我的电脑搞砸了。所以我的问题是：它应该工作与否？

parent.js：

var React = require('react');
var ReactDOM = require('react-dom');
var Child = require('./Child');

var Parent = React.createClass({
  getInitialState: function () {
    return { name: 'Frarthur' };
  },

render: function () {
  return <Child name={this.state.name} />;
}
});

ReactDOM.render(<Parent />, document.getElementById('app'));

child.js：

var React = require('react');

var Child = React.createClass({
  render: function () {
    return <h1>Hey, my name is {this.props.name}</h1>;
  }
})

module.exports = Child;

的index.html：

<!doctype html>

<html lang="en">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width,initial-scale=1.0">

 <title></title>

 <meta name="description" content="">
 <meta name="author" content="">
 <meta name="keywords" content="">

</head>

<body>

 <div id="app"></div>
 <div id="test"></div>

 <script>__REACT_DEVTOOLS_GLOBAL_HOOK__ =  parent.__REACT_DEVTOOLS_GLOBAL_HOOK__</script>
 <script src="bundle.js"></script>

 </body>
 </html>

在这种情况下“不起作用”意味着我有“嘿，我的名字是”但我在屏幕上没有“Frarthur”。所以我没有道具价值。我没有错误或警告。

来自codecademy的ReactJS教程不起作用

0 个答案: