Javascript 未定义react.js useState

我使用react with links，但未定义

useState

    <script src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>


<script type="text/babel">
function App() {
  const [name , setName] = useState('ali');
  const handelClick = () => {
    setName('mahdi')
  }
  return (
  <div className="continer">
    <header>
      <Navbar />
    </header>
    <div className="test">
      <div>{name}</div>
      <button type="button" name="button" onClick={handelClick}> click </button>
    </div>
    <div className="content">
      <Business />
    </div>
  </div>
  )
}

//render components
ReactDOM.render(
  <App />,
  document.getElementById("root")
);

</script>

函数App（）{
const[name，setName]=useState（'ali'）；
常量handelClick=（）=>{
setName（'mahdi'）
}
返回(
{name}
点击
)
}
//渲染组件
ReactDOM.render(
,
document.getElementById（“根”）
);

您需要从全局对象获取它

const { useState } = React;
function App() {
  // ...

所有其他钩子都是这样

---

您可能还希望将

handleClick

更改为

handleClick

，以避免混淆自己。

由于您使用CDN，因此必须将其用作对象

React

的属性，如下所示：

/。。。
const[name，setName]=React.useState（'ali'）；
//...

首先您必须导入它：“从“react”导入{useState}您必须从

react

对象中使用它，通常是通过在代码顶部解构：

const{useState}=React；

@klaus\u bathory-鉴于上述脚本标记的内容，它们似乎没有使用模块。当然，单击处理程序是用于扮演弥赛亚的。；-）