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

Question

我想将其更改为挂钩格式或函数。

代码

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

我的三元运算符缺少什么？

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

HOOK

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>

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

React Hook - Converting from class to hooks - Ternary Operator

reactjs

class

ternary-operator

react-hooks