2017-11-07 6 views
0

reactjs와 함께 material-ui를 사용하고 싶습니다. FlatButton을 렌더링하려고 할 때 다음과 같은 오류가 발생합니다. TypeError: _context$muiTheme is undefinedReact JS 및 material-ui 오류

저는 reactjs를 사용하여 새롭고 무엇이 오류인지 모릅니다. 여기 내 코드 :

import React, {Component} from 'react' 
import { Alert, Button, Jumbotron, Form } from 'reactstrap'; 
import FlatButton from 'material-ui/FlatButton'; 
import TextInput from './TextInput' 

export default class LoginForm extends Component { 
    state = { 
    username: '', 
    password: '' 
    } 

    handleInputChange = (event) => { 
    const target = event.target; 
    const value = target.type === 
     'checkbox' ? target.checked : target.value; 
    const name = target.name; 

    this.setState({ 
     [name]: value 
    }); 
    } 

    componentDidMount() { 
    this.primaryInput.focus(); 
    } 

    onSubmit = (event) => { 
    event.preventDefault() 
    this.props.onSubmit(this.state.username, this.state.password) 
    } 

    render() { 
    const errors = this.props.errors || {} 

    return (
     <Form onSubmit={this.onSubmit}> 
      {errors.non_field_errors?<Alert color="danger">{errors.non_field_errors}</Alert>:""} 
      <TextInput name="username" label="Username" error={errors.username} getRef={input => this.primaryInput = input} onChange={this.handleInputChange}/> 
      <TextInput name="password" label="Password" error={errors.password} type="password" onChange={this.handleInputChange}/> 
      <FlatButton label="Primary" type="submit" primary={true} /> 
     </Form> 

    ) 
    } 
} 

아이디어가 있으십니까?

감사합니다.

답변

2

docsMuiThemeProvider을 앱에 대한 래퍼로 사용해야한다고 말합니다. 예를 들어

:

import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; 
import FlatButton from 'material-ui/FlatButton'; 

<MuiThemeProvider> 
    <FlatButton label="Primary" type="submit" primary={true} /> 
</MuiThemeProvider> 
+0

작품! 고맙습니다 !! – Aceconhielo