Как изменить иконки с React Spring?

Question

Я хочу изменить иконку, когда я нажимаю на нее с помощью пружины реакции. Например, когда я нажимаю «?», он меняется на «?». В документации о реагирующей пружине это можно сделать с помощью переходных элементов, но как мне переключить его с помощью onClick?

https://www.react -spring.io / docs / props / transition

следующие коды предоставлены реактивной пружиной

<Transition
  items={toggle}
  from={{ position: 'absolute', opacity: 0 }}
  enter={{ opacity: 1 }}
  leave={{ opacity: 0 }}>
  {toggle =>
    toggle
      ? props => <div style={props}>?</div>
      : props => <div style={props}>?</div>
  }
</Transition>

Answer 1

создать кнопку и изменить toggle значение при нажатии:

function App() {
  const [toggle, setToggle] = React.useState(false);
  return (
    <>
      <button onClick={() => setToggle(!toggle)}>toggle</button>
      <Transition
        items={toggle}
        from={{ position: "absolute", opacity: 0 }}
        enter={{ opacity: 1 }}
        leave={{ opacity: 0 }}
      >
        {toggle =>
          toggle
            ? props => <div style={props}>?</div>
            : props => <div style={props}>?</div>
        }
      </Transition>
    </>
  );
}