开发者社区> 问答> 正文

在 componentWillReceiveProps里 setState方法的回调函数不会触发

已解决

测试环境
iPhone:10.2.1-iOS
weex_sdk: 0.9.5
qap-cli: 3.0.16
千牛版本: 测试版 5.8.2.1

在下面例子里 Children 组件的 componentWillReceiveProps 中执行了
this.setState({anyValue: true}, () => console.log('componentWillReceiveProps end'));
但是更新完状态 () => console.log('componentWillReceiveProps end')不会执行;

/** @jsx createElement */
import { Env, Transition, Button } from 'nuke';
import {createElement, Component,findDOMNode,render} from 'rax';
import { View, Text,Image} from 'nuke';
const { isWeex, isWeb } = Env;


class Childen extends Component {
    componentWillReceiveProps(nextProps) {
        console.log('componentWillReceiveProps begin');
        this.setState({anyValue: true}, () => console.log('componentWillReceiveProps end'));
    }

    render() {
        console.log('Childen', this.state);
        return <View>Childen</View>
    }
}

class App extends Component {
    constructor(props){
        super(props);
        this.state = {value: 1};
    }
    componentDidMount() {
        this.setState({value: 2}, () => console.log(this.state));
    }
    render() {
        return (
            <Childen value={this.state.value} />
        );
    }
}

render(<App/>);

展开
收起
milo__ 2017-03-03 11:22:51 14589 0
3 条回答
写回答
取消 提交回答
  • 采纳回答

    rax@0.2.2 版本解决了这个bug:

    screenshot

    http://github.com/alibaba/rax

    2019-07-17 20:51:55
    赞同 2 展开评论 打赏
  • 多年前端交互设计经验,目前任职于阿里,定期更新前端文章,欢迎关注...
    this.setState({anyValue: true}, () => console.log('componentWillReceiveProps end'));

    我先测试下


    最新的内建1.0.9已经集成了,等发布新版本即可~~

    2019-07-17 20:51:55
    赞同 2 展开评论 打赏
  • 测试了下:
    1.componentDidMount中setState回调会调用,componentWillReceiveProps中调用setState回调不会执行。
    screenshot

    2.componentWillReceiveProps中调用setState虽然回调不会执行,但是setState是成功的,原因:render函数会在setState之后执行。

    2019-07-17 20:51:55
    赞同 1 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
fibjs 模块重构从回调到协程--陈垒 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载