요약하면, typescript는 모든 material-ui 구성 요소에 누락 부분 property classes을 표시합니다. 즉, Typescript는 classes 속성이 거의 모든 머티리얼에 존재하도록합니다. 즉,입니다. 여기에 ts-loader를 사용하여 컴파일 웹팩 동안 오류 메시지, 나는 다음과 같은 코드가Typescript 재료 UI MUI 구성 요소의 유형에 'classes'속성이 없습니다.
,
는 Header.tsx
import AppBar from 'material-ui/AppBar';
import * as React from 'react';
import { withStyles } from 'material-ui/styles/index';
import Toolbar from 'material-ui/Toolbar';
import Typography from 'material-ui/Typography';
const decorate = withStyles((theme) => ({
header: {
paddingTop: theme.spacing.unit,
width: '100%',
},
}));
const AppBarTypographyStyle = {
color: 'white',
fontSize: '1.6rem',
};
const Header = decorate(({classes}) => (
<header>
<AppBar position="static" classes={{root: classes.header}}>
<Toolbar>
<Typography style={AppBarTypographyStyle} classes={{}} color="inherit" type="title">
OLIVE
</Typography>
</Toolbar>
</AppBar>
</header>
));
export default Header;
내가 다음과 같은 메시지
TS2322: Type '{ children: Element; }' is not assignable to type 'IntrinsicAttributes & ToolbarProps & { children?: ReactNode; }'.
Type '{ children: Element; }' is not assignable to type 'ToolbarProps'.
Property 'classes' is missing in type '{ children: Element; }'
Toolbar에 대한 오류가
AppBar 및 Typography의 경우 에 정의 된 내 스타일과 빈 객체로 classes property을 추가하면 오류가 발생합니다. 이 할 수 없습니다 그러나 그냥
https://material-ui-next.com/customization/css-in-js/
오버라이드 (override) 동안 내가 JS & IN 재료 UI 문서
CSS에서
withStyle장식을 사용하여 스타일링 방법을 다음과style & className properties<AppBar position="static" style={exampleStyleObj} className={exampleClass} >USE
https://material-ui-next.com/customization/overrides/타이프 라이터 재료-UI는 동일있을 경우 내가 확인했다 [email protected] [email protected]
내가 사용을 안내합니다 문제와 다른 곳에서 답 심지어 재료 UI 소스 코드를 확인하고 다음을 발견
/**
* All standard components exposed by `material-ui` are `StyledComponents` with
* certain `classes`, on which one can also set a top-level `className` and inline
* `style`.
*/
export type StandardProps<C, ClassKey extends string, Removals extends keyof C = never> =
& Omit<C & { classes: any }, 'classes' | Removals>
& StyledComponentProps<ClassKey>
& {
className?: string;
style?: Partial<React.CSSProperties>;
}
,238,은 대부분 ComponentProps interface에서 확장됩니다 (예 : AppBarProps). 그러나 지금까지 나는 이들을 해결하기위한 많은 행운이 없습니다.
도와주세요!
Typescript를 사용하고 있으므로 https://www.npmjs.com/package/@types/material-ui를 사용하고 있습니까? – Dane
도와 주셔서 감사합니다. 안타깝게도 @ types/material-ui 유형 정의는 material-ui v0.18.17 용입니다. V1 베타 버전이 아닙니다. V1 베타 유형 정의는 material-ui @ 다음에 프로젝트 자체에 추가되었으므로 추가 @ 유형을 설치할 필요가 없습니다. 그러나 내가 뭘 발견했는지에 따라 내 질문을 편집했습니다. –
@Ioala 예제가'typescript @ 2.4.2'와'material-ui @ 1.0.0-beta.21'로 잘 작동하는 것 같습니다. 더 중요한 것은 비어있는'classes' 소품을 Material UI 구성 요소에 제공한다고 말하면서는 안됩니다 ... 이전 버전의 타이핑에서는 그렇지만 그 이상은 아닙니다. 최신 버전을 사용하고 있습니까? –