如何给 Chakra UI Progress 添加渐变？

Question

我正在尝试将渐变设置为 Chakra UI 的 Progress 组件，但它不支持背景图像更改。知道我如何才能实现这一目标或者甚至可能吗？

Answer 1

我最近遇到了这个问题，并使用prop 来设置进度条的sx实际样式。div

<Progress
  height="24px"
  borderRadius="2xl"
  value={60}
  sx={{
    '& > div': {
      background: 'linear-gradient(90deg, rgba(43,108,176,1) 10%, rgba(66,153,225,1) 90%)',
    },
  }}
/>