javascript - Material 用户界面 : how to change fontSize in Lists?

Question

我正在使用 React js 和 Material UI 创建一些表单。 我想让某些列表上的字体大小更小，以便获得更紧凑的演示文稿，但无论我在哪个级别添加代码 fontSize={10} ，它似乎都没有效果。

如何更改字体大小？

这是一些示例代码，我从Sandbox获得关于 Material UI documentation .

const styles = theme => ({
  root: {
    width: '100%',
    maxWidth: 360,
    backgroundColor: theme.palette.background.paper,
  },
});

function FolderList(props) {
  const { classes } = props;
  return (
    <div className={classes.root}>
      <List>
        <ListItem>
          <ListItemText primary="Photos" secondary="Jan 9, 2014" />
        </ListItem>
        <ListItem>
          <ListItemText primary="Work" secondary="Jan 7, 2014" />
        </ListItem>
      </List>
    </div>
  );
}

Answer 1

对于 mui v5，使用 primaryTypographyProps 属性传递所需的样式

<ListItemText 
    primaryTypographyProps={{fontSize: '18px'}} 
    primary="List Text"
/>