从 Chakra UI 使用无序列表组件时如何删除项目符号图标答案

【问题标题】：How to remove bullet icons when using UnorderedList component from ChakraUI从 Chakra UI 使用无序列表组件时如何删除项目符号图标
【发布时间】：2022-12-15 08:17:52
【问题描述】：

在他们的示例中的https://chakra-ui.com/docs/components/list/usage（复制/粘贴在下面）

<List spacing={3}>
  <ListItem>
    <ListIcon as={MdCheckCircle} color='green.500' />
    Lorem ipsum dolor sit amet, consectetur adipisicing elit
  </ListItem>
  <ListItem>
    <ListIcon as={MdCheckCircle} color='green.500' />
    Assumenda, quia temporibus eveniet a libero incidunt suscipit
  </ListItem>
  <ListItem>
    <ListIcon as={MdCheckCircle} color='green.500' />
    Quidem, ipsam illum quis sed voluptatum quae eum fugit earum
  </ListItem>
  {/* You can also use custom icons from react-icons */}
  <ListItem>
    <ListIcon as={MdSettings} color='green.500' />
    Quidem, ipsam illum quis sed voluptatum quae eum fugit earum
  </ListItem>
</List>

在他们的示例渲染中，没有出现要点。但是，当我在 Chrome (v108.0.5359.98) 上尝试此操作时，我看到了项目符号图标。

我想做相当于li {list-style-type: none;}

我该怎么做呢？

【问题讨论】：

标签： reactjs chakra-ui

【解决方案1】：

<ListItem listStyleType='none' key='whatever-key'>

这应该解决它。出于某种原因，他们的props提到了styleType，但只有listStyleType对我有用。

【讨论】：