您好,我是React新手,这是我的代码
import React, { Component } from 'react';
import injectTapEventPlugin from 'react-tap-event-plugin';
// Needed for onTouchTap
// http://stackoverflow.com/a/34015469/988941
/* eslint-disable import/first */
injectTapEventPlugin();
import './App.css';
import Loginscreen from './Loginscreen'
class App extends Component {
constructor(props){
super(props);
this.state={
loginPage:[],
uploadScreen:[]
}
}
componentWillMount(){
var loginPage =[];
loginPage.push(<Loginscreen parentContext={this}/>);
this.setState({
loginPage:loginPage
})
}
render() {
return (
<div className="App">
{this.state.loginPage}
{this.state.uploadScreen}
</div>
);
}
}
const style = {
margin: 15,
};
export default App;
如果我的代码中有这一行
/ *禁止eslint导入/第一个 /(第5行)
那我得到一个错误
使用JSX时,“反应”必须在范围内
但是如果我删除
/ 禁止导入/导入第一个* /
然后我得到以下错误
导入模块主体;重新排序到排名第一的进口/第一进口
您能帮我解决这个问题吗?预先感谢
这是我的LoginScreen.js
import React, { Component } from 'react';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import RaisedButton from 'material-ui/RaisedButton';
import Login from './Login';
class Loginscreen extends Component {
constructor(props){
super(props);
this.state={
username:'',
password:'',
loginscreen:[],
loginmessage:'',
buttonLabel:'Register',
isLogin:true
}
}
componentWillMount(){
var loginscreen=[];
loginscreen.push(<Login parentContext={this} appContext={this.props.parentContext}/>);
var loginmessage = "Not registered yet, Register Now";
this.setState({
loginscreen:loginscreen,
loginmessage:loginmessage
})
}
render() {
return (
<div className="loginscreen">
{this.state.loginscreen}
<div>
{this.state.loginmessage}
<MuiThemeProvider>
<div>
<RaisedButton label={this.state.buttonLabel} primary={true} style={style} onClick={(event) => this.handleClick(event)}/>
</div>
</MuiThemeProvider>
</div>
</div>
);
}
}
const style = {
margin: 15,
};
export default Loginscreen;