将附加参数传递给 onChange 函数 React

问题描述

我正在尝试将一个备用的布尔参数传递给 ReactJS 中的 onChange 处理程序。这个想法是，在一场足球比赛中，前端会在比赛事件发生时添加它们（在这种情况下是角球）。这个想法是布尔值 homeOrAway 将表示角球是判给主队还是客队。

这是 JSX 和钩子：

  const [homeCorners,setHomeCorners] = useState(0);

        <Form>
          <Form.Group controlId="homeCorners"></Form.Group>
          <Form.Label>Home Corners</Form.Label>
          <Form.Control
            type="number"
            id="homeCornersInput"
            name="homeCorners"
            step="1"
            value={homeCorners}
            min="0"
            max="50"
            style={{
              width: "82.5px",}}
            onChange={(e) => adjustCorners(true)}
          ></Form.Control>
        </Form>

这里是 adjustCorners 函数。我尝试了一个咖喱函数，但它似乎不起作用：

 function adjustCorners(homeOrAway) {
    let updatedMatchEvents = [...matchEvents];
    let cornerEvent = {
      isHome: homeOrAway,eventType: 1,playerId: 0,period: 1,minute: 0,second: 0,};

    return (event) => {
      if (homeOrAway === true) {
        if (event.target.value < homeCorners) {
          updatedMatchEvents.pop();
          setMatchEvents(updatedMatchEvents);
        } else {
          updatedMatchEvents.push(cornerEvent);
          setMatchEvents(updatedMatchEvents);
        }
      } else {
        if (event.target.value < awayCorners) {
          updatedMatchEvents.pop();
          setMatchEvents(updatedMatchEvents);
        } else {
          updatedMatchEvents.push(cornerEvent);
          setMatchEvents(updatedMatchEvents);
        }
      }
    };
  }

我也试过只使用基本的箭头函数，但它似乎也不起作用。我可以打印到控制台，但 Form 不会增加或减少：

const adjustCorners = (homeOrAway,corners) => {
    let updatedMatchEvents = [...matchEvents];
    let cornerEvent = {
      isHome: homeOrAway,};

    if (homeOrAway === true) {
      if (corners < homeCorners) {
        updatedMatchEvents.pop();
        setMatchEvents(updatedMatchEvents);
      } else {
        updatedMatchEvents.push(cornerEvent);
        setMatchEvents(updatedMatchEvents);
      }
    } else {
      if (corners < awayCorners) {
        updatedMatchEvents.pop();
        setMatchEvents(updatedMatchEvents);
      } else {
        updatedMatchEvents.push(cornerEvent);
        setMatchEvents(updatedMatchEvents);
      }
    }
  };

解决方法

根据您的逻辑，pcd = o3d.io.read_point_cloud('./mesh.xyz') pcd.estimate_normals() # to obtain a consistent normal orientation pcd.orient_normals_towards_camera_location(pcd.get_center()) pcd.normals = o3d.utility.Vector3dVector( - np.asarray(pcd.normals)) # surface reconstruction using Poisson reconstruction mesh,_ = o3d.geometry.TriangleMesh.create_from_point_cloud_poisson(pcd,depth=9) o3d.io.write_triangle_mesh('mesh.stl',mesh) 返回一个函数，因此您需要向它传递一个值。

此外，由于 Synthetic events 在 React 中的工作方式，您应该传递实际值而不是事件对象。

adjustCorners

重写示例：

// Rewrite adjustCorners to use the value and not reference the event.
onChange={(e) => adjustCorners(true)(e.target.value)}

// BUG,DON'T DO IT,READ ABOUT SYNTHETIC EVENTS
onChange={(e) => adjustCorners(true)(e)} // !! BUG CAREFUL