问题描述
详细报错信息:
./src/component/Login.js
Line 13: 'inject' is not defined no-undef
Search for the keywords to learn more about each error.
问题出现的环境背景及自己尝试过哪些方法
使用mobx-react的inject导致运行报错
相关代码
// 请把代码文本粘贴到下方(请勿用图片代替代码)
Login.js代码如下:
/**
- Created by 20161221 on 2018/12/24.
*/
/**
- Created by 20161221 on 2018/12/24.
*/
import React, { Component } from 'react';
import {
Button, Form, FormGroup, Label, Input, FormText
} from 'reactstrap';
import { observer } from 'mobx-react';
@inject("store")
@observer
export default class Login extends Component {
constructor(props) {
super( props );
this.state = {"email":"598643474@qq.com","password":""};
}
change(){
this.setState({"email":"583513772@qq.com"});
}
login(){
this.props.store.login(this.state.email,this.state.password);
}
handleChange(e , field){
console.log("in change "+field+ e.target.value);
let o = {};
o[field] = e.target.value;
this.setState(o)
}
render(){
return(
<div>
<h1 class="page-title">用户登入</h1>
<Form>
<FormGroup>
<Input type="email" name="email" placeholder="Email" value={this.state.email} onChange={(e)=>this.handleChange(e,'email')} />
</FormGroup>
<FormGroup>
<Input type="password" name="password" placeholder="密码(6-12个字符)" value={this.state.password} onChange={(e)=>this.handleChange(e,'password')} />
</FormGroup>
<FormGroup>
<Button color="primary" onClick={()=>this.login()}>登入</Button>
</FormGroup>
</Form>
</div>
)
}
}
/*
<FormGroup>
<Input type="email" name="email" placeholder="Email" value={this.state.email} onClick={()=>this.change()} />
</FormGroup>
*/
index.js代码如下:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { Provider } from "mbox-react";
import AppState from './store/AppState';
ReactDOM.render(
<Provider store = {AppState}><App /></Provider>
, document.getElementById('root'));
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: http://bit.ly/CRA-PWA
serviceWorker.unregister();
package.json代码如下:
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"bootstrap": "^4.0.0",
"jquery": "^3.3.1",
"mobx": "^4.1.0",
"mobx-react": "^5.0.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2",
"react-scripts": "1.1.1",
"react-transition-group": "^2.2.1",
"reactstrap": "^4.8.0"
},
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"react-app-rewire-mobx": "^1.0.7",
"react-app-rewired": "^1.5.0"
}
}
你期待的结果是什么?实际看到的错误信息又是什么?
希望能执行inject运行成功
这个 observer 你有从 mobx-react 中引入,但是你的 inject 没有引入,所以报了 inject未定义这个错误。
建议引入一下:
import { observer, inject } from "mobx-react";