useTransition

import React, { useState } from 'react';
import { useTransition, animated } from 'react-spring';
function App() {
  const [show, set] = useState(false)
  const [items, setItems] = useState([{text:'zhangsan',key:1},
    {text:'lisi',key:2},{text:'wangwu',key:3}])
  const transitions = useTransition(show, {
    from: { opacity: 0 },
    enter: { opacity: 1 },
    leave: { opacity: 0 },
    reverse: show,
    delay: 300,
    // config: config.molasses,
    // onRest: () => set(!show),
  })
  return (
    <div>
      {
        transitions(
          (styles, item) => item && <animated.div style={styles}>✌️</animated.div>
        )
      }
      <button onClick={() => set(true)}>asdf</button>
    </div>
  )
}
export default App;