我用antd的步骤条Steps,渲染是他每次都是延迟渲染出来,确没有触发update相关生命周期,这是为什么?

使用antd的steps。代码如下,没有报错

    <Steps>
        <Step status="finish" title="第一步" icon={<Icon type="user" />} />
        <Step status="finish" title="第二步" icon={<Icon type="environment-o" />} />
        <Step status="finish" title="第三步" icon={<Icon type="environment-o" />} />
        <Step status="process" title="第四步" icon={<Icon type="smile-o" />} />
    </Steps>

渲染结果:
clipboard.png
问题是他每次都是都是延迟显示(大约100ms吧)。
这样用户体验很不好,先打印各个生命周期,发现只执行了三个:

clipboard.png

于是我从componentDidMount开始debugger,(此时其他部分都已经渲染好了只有steps没有渲染),并截取了部分关键的源码,希望大佬们看看为什么

clipboard.png

clipboard.png

clipboard.png
终于在这张图的35628行渲染了。但是为什么不知行生命周期函数呢?顺便截了下一张图

clipboard.png

麻烦大佬们看看,很不解为什么会延迟渲染,有不执行生命周期函数

阅读 5.2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏