React Hook - 从类转换为钩子 - 三元运算符

Question

我想把这个改成钩子格式或者函数。

代码

updateRoom(roomId){
  if (roomId === '') {
    this.setState({RoomId: '', Room: ''})
  } else {
  this.setState({RoomId: roomId.key, Room: roomId.name});
  }
 }

我在三元运算符中缺少什么？

我是否必须将我的函数名称更改为 useUpdateRoom 来表示挂钩函数？

挂钩

function UpdateRoom(roomId) {
  return '' ? setRoomId : Room
}

function App() {

  const [rooms, setRooms]   = useState('');
  const [roomId, setRoomId] = useState('');
  const [user, setUser]     = useState('');


return (
  <div className="app">
  <div className="room">
  {rooms.map((room, index) => (
    <Room key={index} index={index} room={room} />

  ))}
 </div>
 </div>
 )
}

Answer 1

您的三元组未评估 roomId。为了清楚起见，我还将参数重命名为“id”。应该是：

function App() {
  const [rooms, setRooms]   = useState('');
  const [roomId, setRoomId] = useState('');
  const [user, setUser]     = useState('');

  function updateRoom(id) {
    return id === '' 
      ? setRoomId('')
      : setRoomId(id)
  }

  return (
    <div className="app">
      <div className="room">
      {rooms.map((room, index) => (
        <Room key={index} index={index} room={room} />
      ))}
    </div>
  </div>
  )
}

此外，您需要将函数放入 App 中，以便它可以访问 setRoomId。

最后，我看不到你在哪里调用它，但它会是这样的：

<button onClick={() => updateRoom(some_id)}>Change Room</button>