AgRrid cellRendererFramework не имеет доступа к теме пользовательского интерфейса материалов - PullRequest
Новая
       21

AgRrid cellRendererFramework не имеет доступа к теме пользовательского интерфейса материалов

0 голосов
/ 30 октября 2019

У меня есть AgGrid, с помощью которого cellRendererFramework я могу визуализировать свои собственные кнопки в столбце, все отлично работает, я могу без проблем визуализировать свою кнопку пользовательского интерфейса, пока я не создал больше цветов в моемПалитра темы выглядит следующим образом: 

const theme = createMuiTheme({
  palette: {
    text: {
      primary: "rgba(0, 0, 0, 1)",
      secondary: "rgba(0, 0, 0, 1)",
    },
    primary: {
      main: '#064d80',
      contrastText: 'white',
    },
    // secondary: {
    //   main: '#f44336',
    // },
    secondary: {
      main: '#1b5e20',
      contrastText: 'white',
    },
    success: {
      main: '#28a745',
      contrastText: 'white',
      dark: 'rgb(97, 0, 0)'
    },
    pdfRed: {
      main: '#880000',
      contrastText: 'white',
      dark: 'rgb(97, 0, 0)'
    },
    lightGreen: {
      main: 'rgb(92, 184, 92)',
      contrastText: 'white',
      dark: 'rgb(45, 92, 46)',
    },
  },
});

function App() {

  return (
    <ThemeProvider theme={theme}>
      <div className="App">

        <Cockpit />
      </div>
    </ThemeProvider>
  );
}

export default App;

А потом я написал класс кнопок, который использует палитру: 

import React from "react";
import { withStyles } from "@material-ui/core/styles";
import MaterialUIButton from "@material-ui/core/Button";

const Button = withStyles(theme => {
    console.log('theme', theme)
    return {
        root: props =>
            (props.variant === "contained" && props.color !== 'primary' && props.color !== 'secondary')
                ? {
                    color: theme.palette[props.color].contrastText,
                    backgroundColor: theme.palette[props.color].main,
                    "&:hover": {
                        backgroundColor: theme.palette[props.color].dark,
                        // Reset on touch devices, it doesn't add specificity
                        "@media (hover: none)": {
                            backgroundColor: theme.palette[props.color].main
                        }
                    }
                }
                : {}
    }
}
)(MaterialUIButton);

const muiButton = (props) => {
    return (
        <Button {...props}>
            {props.children}
        </Button>
    )
}

export default muiButton;

Это прекрасно работает в любом месте моей программы, но когда я использую кнопку внутриcellRendererFramework я получаю сообщение об ошибке, что цвет, к которому я обращаюсь, равен undefined, после того как я сделал console.log(theme), я заметил, что внутри cellRendererFramework в theme.palette нет новых цветов, которые я предоставил своей программев app.js, в чем проблема, что вы предлагаете в качестве обходного пути?
Спасибо.

...