Visit page in browser localhost:3000 and see this: Import )Įxport default withStyles(styles)(SearchBar)
#Tabview prop href did not match prime react install
Minimal steps to reproduce: Create project folder and start Node server: mkdir app cd app npm init -y npm install react react-dom next material-ui/core npm run dev edit package.json: Add to 'scripts': 'dev. Import CssBaseline from SearchBar from "./components/SearchBar"Īpp/components/SearchBar.jsx: import PropTypes from "prop-types" I don't know enough to tell whether this Github discussion might help, but likely not since they were using a beta version of Material-UI. Npm install react react-dom next run devĪdd to 'scripts': "dev": "next", app/pages/index.jsx: import Head from "next/head" Minimal steps to reproduce:Ĭreate project folder and start Node server: mkdir app I don't know enough to tell whether this Github discussion might help, but likely not since they were using a beta version of Material-UI. need to upgrade to version ^1.0.0, using a custom server.js, and using Math.random in setState), but none of these apply in my case. There are a few questions on Stack Overflow addressing why the client and server might render classNames differently (e.g. The same underlying issue being that icon was not receiving the correct class for styling. The 'x' icon rendered with a monstrous 1024px width after refreshing. I experienced a similar issue when adding Material-UI Chips with a delete 'x' icon. I've followed the Material-UI TextField example docs, and their accompanying Code Sandbox example, but I can't seem to figure out what is causing the difference between the server and client classNames. Server: "MuiFormControl-root-3 MuiFormControl-marginNormal-4Ĭlient: "MuiFormControl-root-3 MuiFormControl-marginNormal-4 This is the error message I am receiving on the Console: The classNames are assigned correctly on first loading the page, but after refreshing the page, the classNames no longer match so the component loses its styling. I'm having difficulty with differences between client-side and server-side rendering of styles in Material-UI components due to classNames being assigned differently.
0 kommentar(er)
