问题描述:
使用create-react-app+MobX,npm start
,报错

源码:
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import {observable} from 'mobx';
import {observer} from 'mobx-react';
//1.定义状态
var appState = observable({
timer: 0
});
//2.创建视图
@observer
class TimerView extends React.Component {
render() {
return (<button onClick={this.onReset.bind(this)}>
Seconds passed: {this.props.appState.timer}
</button>);
}
onReset () {
this.props.appState.resetTimer();
}
};
//3.更改状态
appState.resetTimer = () => {
appState.timer = 0;
};
setInterval(()=>{
appState.timer += 1;
}, 1000);
class App extends Component {
render() {
return (
<div className="App">
<TimerView appState={appState} />
</div>
);
}
}
export default App;
问题原因:
create-react-app 没有内置的装饰器支持
解决方案:
- 因为ES.next 装饰器是可选的,所以最笨的就是不用
- 为create-react-app添加装饰器支持
可以使用 eject 命令 或使用 react-app-rewired
网友评论