Question

这是我的App.js文件，我没有看到主题发生任何变化。

import getMuiTheme from 'material-ui/styles/getMuiTheme';

import {
  blue400, blue700,
  pinkA200,
  grey100, grey300, grey400, grey500,
  white, darkBlack, fullBlack,
} from 'material-ui/styles/colors';
import { fade } from 'material-ui/utils/colorManipulator';
import spacing from 'material-ui/styles/spacing';

const myTheme = {
    spacing: spacing,
    fontFamily: 'Roboto, sans-serif',
    palette: {
      primary1Color: blue400,
      primary2Color: blue700,
      primary3Color: grey400,
      accent1Color: pinkA200,
      accent2Color: grey100,
      accent3Color: grey500,
      textColor: darkBlack,
      alternateTextColor: white,
      canvasColor: white,
      borderColor: grey300,
      disabledColor: fade(darkBlack, 0.3),
      pickerHeaderColor: blue400,
      clockCircleColor: fade(darkBlack, 0.07),
      shadowColor: fullBlack,
    },
}

class App extends Component {

    constructor() {
        super();
        this.state = { restClient: null };
    }
    componentWillMount() {
        buildApolloClient()
            .then(restClient => this.setState({ restClient }));
    }

    render() {
        if (!this.state.restClient) {
            return <div>Loading</div>;
        }

        return (
            <Admin
              title="Cruceritis HQ"
              restClient={this.state.restClient}
              customReducers={{ theme: themeReducer }}
              theme={getMuiTheme(myTheme)}
              customSagas={sagas}
              customRoutes={customRoutes}
              authClient={authClient}
              dashboard={Dashboard}
              loginPage={Login}
              appLayout={Layout}
              menu={Menu}
              messages={translations}
              locale="es"

            >
              <Resource name="Customer" list={VisitorList} edit={VisitorEdit} remove={VisitorDelete} icon={VisitorIcon} />
              <Resource name="Command" list={CommandList} edit={CommandEdit} remove={Delete} icon={CommandIcon} options={{ label: 'Orders' }} />
              <Resource name="Product" list={ProductList} create={ProductCreate} edit={ProductEdit} remove={Delete} icon={ProductIcon} />
              <Resource name="Category" list={CategoryList} edit={CategoryEdit} remove={Delete} icon={CategoryIcon} />
              <Resource name="Review" list={ReviewList} edit={ReviewEdit} icon={ReviewIcon} />
              <Resource name="Segment" list={SegmentList} icon={SegmentIcon} />
              <Resource name="CommandItem" />
            </Admin>
        );
    }
}

export default App;

我对自己可能做错的事情一无所知......

我尝试过导入darkTheme但也没有工作

我应该修理什么？

Answer 1

您似乎没有应用主题。您需要遵循这种方法（对于v0.x）：

import React from 'react';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import getMuiTheme from 'material-ui/styles/getMuiTheme';
import App from './App';

const myTheme = {
  palette: {
    primary1Color: 'red',
  },
}

const Main = () => (
  <MuiThemeProvider muiTheme={getMuiTheme(myTheme)}>
    <App />
  </MuiThemeProvider>
);

export default Main;

将来你可以提供一个简单的例子，它仍能解决问题，但噪音较小。

使用[admin-on-rest] [aor-graqhql]自定义主题

1 个答案: