时间戳

首页 > 解决方案 > 无法让 React onClick 触发

javascript - 无法让 React onClick 触发

问题描述

我试图教自己做出反应。我似乎在让事件触发方面遇到问题。在这一点上，我要做的就是使用 useState 钩子来获取和设置一个按钮。该按钮最初以正确的值 100 呈现。当我单击该按钮时，我希望该按钮更新为 999。在此先感谢您的时间！

下面是一个名为 UserInterface.js 的文件

import React, { useState } from "react";
import InputElement from "./InputElement";

const useAppState = () => {
  const [numberOfButtonClicks, setnumberOfButtonClicks] = useState(100);

  const setAppState = () => {
    setnumberOfButtonClicks(999);
  };

  return { numberOfButtonClicks, setAppState };
};

const UserInterface = () => {
  const { numberOfButtonClicks, setAppState } = useAppState();

  return (
    <InputElement onClick={setAppState} numClicks={numberOfButtonClicks} />
  );
};

export default UserInterface;

下面是一个名为 InputElement.js 的文件

import React from "react";

const InputElement = (props) => (
  <button onClick={() => props.onClick()}>{props.numClicks}</button>
);

export default InputElement;import React from "react";

标签： javascriptreactjsonclickdom-events

解决方案

尝试更改<InputElement onClick={setAppState} ... /> 为<InputElement onClick={() => setAppState(999)} ... /> 和按钮应该是<button onClick={props.onClick}>{props.numClicks}</button>

推荐阅读