Question

我正在做一个仪表板，在我的菜单中，问题是我不能像往常一样使用class component，如果不能使用react hooks，我几乎不懂JavaScript，因此对我来说很复杂< / p>

以前在类组件中，我执行过此功能：

class Technologies extends Component {
  handleChange(checked) {
    this.setState({ checked })
  }
  render() {
    return (
      <div className="section-7">
        <button
          onClick={() => this.handleChange(false)}
          className={`btnT _1 ${this.state.checked === false}`}
        >
          FACIAL RECOGNITION
        </button>
        <button
          onClick={() => this.handleChange(true)}
          className={`btnT  ${this.state.checked === true}`}
        >
          OBJECT DETECTION
        </button>
      </div>
    )
  }
}

我需要激活新代码

export default () => {
  const [pantalla, setView] = useState(<RealTime />)
  let cambiarpantalla = View => {
    setView(<View />)
  }

  return (
    <div>
      <div
        className="border-primary border-l-2 shadow-active "
        onClick={() => cambiarpantalla(RealTime)}
      >
        <div className="flex items-center  cursor-pointer mx-4  p-4 border-b border-line">
          <Real />
          <p className="ml-3">Real Time</p>
        </div>
      </div>
      <div onClick={() => cambiarpantalla(Analitycs)}>
        <div className="flex items-center  cursor-pointer  p-4 mx-4 border-b border-line">
          <AnalitycsS />
          <p className="ml-3">Analitycs</p>
        </div>
      </div>
      <div className="overflow-auto">{pantalla}</div>
    </div>
  )
}

我不知道如何使该按钮单击并更改屏幕以使其变为活动状态，该类处于阴影活动状态

Answer 1

使用onClick = {（）=> this.your_function（params）}

如何激活反应按钮？

1 个答案: