javascript - 有没有一种方法可以使用 material ui @next React 将不同的字体添加到 Typography 中的不同属性

Question

const fontWeightMedium = 500;
const theme = createMuiTheme({
  typography: {
    // Use the system font.
    fontFamily:
    'forzaBook',
    fontWeightMedium,
    body1: {
      fontWeight: fontWeightMedium,
    },
    button: {
      fontStyle: 'italic',
    },
    caption: {
      fontWeight:100
    }
  },
  palette: {
    primary: orange,
    secondary: {
      ...grey,
      // A400: '#00e677',
    },
    contrast: 'white',
    error: red,
  }
});

这是我目前用来更改字体和一些排版属性的内容。但我需要更改标题的字体。有谁知道如何做到这一点？

Answer 1

您可以在每个排版变体的基础上覆盖 fontFamily:

const theme = createMuiTheme({
  typography: {
    fontFamily: 'forzaBook', // Change the default
    caption: {
      fontFamily: "openSans" // Change a specific variant
    }
  },
});