Javascript 为什么HTML/React页面出现语法错误

下面是一组据称有效的示例

我只是跳进了React，我认为这个页面应该可以工作，但它没有。 它在返回时失败

<script>
    window.onload = function()
    {
        class App extends React.Component
        {
            constructor()
            {
                super();
                this.state = {value: ''};
                this.onChange = this.onChange.bind(this)
            }

            onChange(e)
            {
                const re = /^[0-9\b]+$/;
                if (e.target.value === '' || re.test(e.target.value)) 
                {
                    this.setState({value: e.target.value})
                }
            }

            render()
            {
                return <input value={this.state.value} onChange={this.onChange}/>
            }
        }

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

}

</script>

---

无法在浏览器中执行JSX。在执行之前，需要将其编译为常规javascript

JSX是类似HTML的语法，比如：。这是javascript的一种特殊形式

有多种编译JSX的方法，但最常见的是使用Babel或TypeScript编译器

---

阅读更多关于您试图在普通元素中特别使用JSX语法的信息。它需要使用Babel转换为JavaScript，最好是在构建时，而不是在到达浏览器之后，浏览器才能理解它

---

这已涵盖。

您能在控制台上显示错误消息吗？您是否添加了react.js库，如果是，需要完整的html页面而不仅仅是scriptJSX，在browserReactDOM.RenderAct.createElementApp，document.getElementById'app'中执行之前需要编译它