React side project--Speed dial(快速菜單)

2022 iThome 鐵人賽

DAY 27

自我挑戰組

React 面項目看起來很好吃吧--佐material 調料系列第 27 篇

14th鐵人賽

Vader

2022-10-11 14:25:22

427 瀏覽

分享至

不管在手機版本或是儀表板(dashboard)，都可以有一個可收合的菜單

在Css中要設定許多狀態，

如今在Mui中出了一個元件，簡單管理狀態來開合組件

<SpeedDial
  ariaLabel="SpeedDial basic example"
  sx={{ position: 'absolute', bottom: 16, right: 16 }}
  icon={<SpeedDialIcon />}
>
  {actions.map((action) => (
    <SpeedDialAction
      key={action.name}
      icon={action.icon}
      tooltipTitle={action.name}
    />
  ))}
</SpeedDial>