Closed GrubbyHunter closed 7 years ago
Maybe there are not the same problem, can you try dispatch an action in componentDidUpdate
?
I've got the same problem in conjunction with redux connect.
To reproduce: create a redux action + connect it to a component create handler func inside the component, calling the connected action trigger handler func from ui
The error occurs in the same method as #82, but a few lines up. I can give detailed information if required.
@jnsone11 a few line of real code will be great!!
export const navigateTo = (location) => {
return (dispatch) => {
dispatch({
type: NAVIGATE_TO,
to: location
});
browserHistory.push(location);
}
};
import {OPEN_DRAWER,CLOSE_DRAWER,TOGGLE_DRAWER} from '../const.js'
const drawer = (state = {},action) => {
switch(action.type){
case OPEN_DRAWER:
return {isOpen : true};
case CLOSE_DRAWER:
return {isOpen : false};
case TOGGLE_DRAWER:
return {isOpen : !state.isOpen}
}
return state;
};
export default drawer
const combinedReducers = combineReducers({
routing : routerReducer,
drawer,
});
export default combinedReducers
const store = createStore(combinedReducers,initialState,applyMiddleware(thunk));
import React from 'react';
import Drawer from 'material-ui/Drawer';
import MenuItem from 'material-ui/MenuItem';
import {connect} from 'react-redux';
import {open, close, navigateTo} from '../actions/drawer'
import {APP_TITLE} from '../const';
import AppBar from 'material-ui/AppBar';
const DrawerComponent = React.createClass({
navigateTo(e, location){
this.props.navigateTo(location);
this.closeDrawerOnSmallScreen();
},
closeDrawerOnSmallScreen(){
if (!this.props.largeScreen && this.props.isOpen) {
this.props.close();
}
},
drawerOnRequestChange(open, reason){
if (reason == 'swipe' || reason == 'clickaway') {
if (open) {
this.props.open();
} else {
this.props.close();
}
}
},
render(){
const topMargin = 0;
const style = this.props.largeScreen ? {width: 180, marginTop: topMargin} : {width: 200, marginTop: topMargin};
return (
<Drawer
overlayStyle={{marginTop: topMargin}}
containerStyle={style}
open={this.props.isOpen}
onRequestChange={(open, reason) => this.drawerOnRequestChange(open, reason)}
docked={this.props.largeScreen}>
title={APP_TITLE}
<MenuItem onTouchTap={(e) => this.navigateTo(e, '/')}>Home</MenuItem>
</Drawer>
);
}
});
export default connect(state => {
return {isOpen: state.drawer.isOpen, largeScreen: state.screen.largeScreen}
}, {open, close, navigateTo})(DrawerComponent)
this.closeDrawerOnSmallScreen() fails at line 2513 in react lite js I guess.
Please let me know if I can contribute any further.
@jnsone11
react-lite can't work with react-tap-event-plugin
, please use fastclick instead. or add alias 'react-tap-event-plugin': 'react-lite/lib/react-tap-event-plugin'
, just like here
It seems like something was wrong with my aliasing. I aliased tap event plugin but did not install fastclick.
Seems like everything is working now. I came down from 123kb to 92.3kb.
One tradeoff, it seems I don't get hover events anymore for Menuitems in the Drawer.
@jnsone11 react-lite/lib/react-tap-event-plugin
will require('fastclick')
, fastclick should be installed.
我找到原因了,我是在componentWillReceiveProps方法里面setState,然后再componentDidUpdate里面dispatch一个action就报错了
@GrubbyHunter 解决了吗?
暂时没有,我在15.15版本的基础上加上这个修改方案 (https://github.com/Lucifier129/react-lite/commit/44dd19e5a846a1d9dff35aef0d31edf6129da5af) 能解决,但是在master主干代码上使用 (https://github.com/Lucifier129/react-lite/commit/44dd19e5a846a1d9dff35aef0d31edf6129da5af) 这个方案就不行。可能是后续的版本有冲突,因为公司现在用的最新的代码已经部署上线了,没办法用旧版本去fix,所以我还得看看
@GrubbyHunter 是用这份代码吗?
不是,这份已经修复过了,是这个 (https://github.com/Lucifier129/react-lite/blob/0.15.15/src/virtual-dom.js) 主要是改这个文件改完打包就没报错了
@GrubbyHunter 我不是很明白你的意思。是指目前 master 分支的 react-lite 无法解决问题,而 0.15.15 版本的代码加上那个 pull request 修改可以解决问题?
是的
@GrubbyHunter 难以理解~~
@GrubbyHunter 明天看看
好的
我 fork了自己修改了下可以正常跑了,你看下
我fixed是15.30版本,你能不能帮review下然后合并到15.30里面啊,因为我们项目现在用的15.30版本
we develop the use of react-lite for build project, when i in the react componentWillReceiveProps method dispatch an action , the react-lite will show zhe error : Can not read property '$ updater' of undefined., but i use react to build project will not report this error.
I know you have a fix in the previous version of this problem(https://github.com/Lucifier129/react-lite/issues/82), but I use the new master code when I will report this error, so i don't no how to fix it