Question

我正在尝试将react js添加到基本网页。这是文件结构：

////
├─index.html
└─js/
  ├─Page.js
  └─index.js

index.html：

<body>
    <div id="root"></div>
    <script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    <script src="js/index.js" type="text/babel"> </script>
</body>

index.js：

import ReactDOM from 'react-dom';
import Page from './Page';

ReactDOM.render(<Page />, document.getElementById('root'));

Page.js：

import {Component} from 'react'

class Page extends Component {
    render() {
        return (
            <h1>Hello World!</h1>
        )
    }
}

export default Page;

由于某种原因，Hello World在我打开index.html时没有出现在页面上。如何修复此页面？

Answer 1

在您的index.js中，您应该import React，因为您的组件将与Babel一起转换为React.createElement('h1', null, 'hello world')

无法添加对网页的反应

1 个答案: