React中使用canvas画图没有效果

[weixin_38058428]

结构是下面这样的，但是没有效果 import 。。。。。 class TradingCenter extends Component { constructor() { super(); } componentDidMount() { {localStorage.getItem('cookie_state') === '0'? ( this.draw() ) : ''} } draw = () => { var canvas = document.getElementById("canvas"); var ctx=canvas.getContext('2d'); ctx.fillRect(100, 100, 300, 150); ctx.fillStyle ="rgb(0, 0, 0, 0.6)"; ctx.fill(); ctx.strokeStyle = "red"; } render() { return( <div> {localStorage.getItem('cookie_state') === '0'? ( <canvas id="canvas" width={document.body.clientWidth} height={document.body.scrollHeight}></canvas> ) : ''} </div> ) } } export default myConnect( state => ({ ...state.tradingCenter, ...state.appConfig, mobile: state.userConfig.mobile, email: state.userConfig.email, precision: state.tokenConfig.precision, tokenMap: state.tokenConfig.tokenMap, tokenName: state.tokenConfig.tokenName, istransaction: state.tokenConfig.istransaction, tokenCNName: state.tokenConfig.tokenCNName }), dispatch => bindActionCreators(actions, dispatch) )(TradingCenter);