Javascript 如何更改复选框材质表的颜色

我正在我的项目中使用材质表，希望更改选中复选框的颜色。怎么做

function BasicSelection() {
  return (
    <MaterialTable
      title="Basic Selection Preview"
      columns={[
        { title: 'Name', field: 'name' },
        { title: 'Surname', field: 'surname' },
        { title: 'Birth Year', field: 'birthYear', type: 'numeric' },
        {
          title: 'Birth Place',
          field: 'birthCity',
          lookup: { 34: 'İstanbul', 63: 'Şanlıurfa' },
        },
      ]}
      data={[
        { name: 'Mehmet', surname: 'Baran', birthYear: 1987, birthCity: 63 },
        { name: 'Zerya Betül', surname: 'Baran', birthYear: 2017, birthCity: 34 },
      ]}        
      options={{
        selection: true
      }}
    />
  )
}

函数基本选择（）{
返回(
)
}

我认为，如果您想更改该颜色，则很有可能在组件的其他位置使用该颜色。可能会考虑将表格设置为与应用程序外观相匹配的主题。材质表提供了一个主题裁剪，可用于覆盖应用于复选框的默认

secondary.main

颜色

muithemeprovider（）函数样式{
const theme=createMuiTheme({
调色板：{
主要：{
主要内容：“#4caf50”，
},
中学：{
main:#ff0000",，
},
},
});
返回(
)
}

您检查过这个吗

function StylingWithMuiThemeProvider() {
  const theme = createMuiTheme({
    palette: {
      primary: {
        main: '#4caf50',
      },
      secondary: {
        main: '#ff0000',
      },
    },

  });

  return (
    <MuiThemeProvider theme={theme}>

    <MaterialTable
      title="Basic Selection Preview"
      columns={[
        { title: 'Name', field: 'name' },
        { title: 'Surname', field: 'surname' },
        { title: 'Birth Year', field: 'birthYear', type: 'numeric' },
        {
          title: 'Birth Place',
          field: 'birthCity',
          lookup: { 34: 'İstanbul', 63: 'Şanlıurfa' },
        },
      ]}
      data={[
        { name: 'Mehmet', surname: 'Baran', birthYear: 1987, birthCity: 63 },
        { name: 'Zerya Betül', surname: 'Baran', birthYear: 2017, birthCity: 34 },
      ]}        
      options={{
        selection: true
      }}
    />
    </MuiThemeProvider>
  )
}