Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

使用React Hooks的问题 #31

Closed
Lixucheng opened this issue May 15, 2019 · 1 comment
Closed

使用React Hooks的问题 #31

Lixucheng opened this issue May 15, 2019 · 1 comment

Comments

@Lixucheng
Copy link

Lixucheng commented May 15, 2019

在noform/repeater/factory.js文件中

 async componentWillReceiveProps(nextProps) {
            const { filter, asyncHandler, formConfig } = this.props;
            const manualEvent = this.genManualEvent();
            if (deepEqual(this.props, nextProps) && !manualEvent.type) {
                return;
            }

            if (!deepEqual(asyncHandler, nextProps.asyncHandler)) {
                this.repeaterCore.asyncHandler = nextProps.asyncHandler;
            }
}

问题1:
deepEqual(this.props, nextProps)里面会有react节点,节点会有循环引用的情况, 导致deepEqual死循环, 推荐单独判断需要的字段而不是直接deepEqual
问题2:
使用reacthook之后方法的每次渲染都是一个新的

function OutputForm({ nodes }) {
    const afterSetting = (event: any, repeater: any) => {
       // use 变量nodes
    };

    return (
xxx
<InlineRepeater
    multiple
    asyncHandler={{
          afterSetting,
     }}
>
xxx
  )

这里的afterSetting方法每次渲染都是一个新的,里面引用的变量nodes可能有变化,但是deepEqual并不能识别出来这是一个新的方法, 导致后面的新afterSetting无法正确设置this.repeaterCore.asyncHandler。所以afterSetting触发的一直都是第一次渲染的那一个afterSetting, 而第一次渲染的时候afterSetting方法里面使用的props.nodes是[]空的。

@quirkyshop
Copy link
Contributor

@Lixucheng
问题1 非常感谢帮助找到这个bug,现在着手去解决。
问题2 暂时没有太好的想法去解决,可能需要对hook做一些改造才能支持,欢迎提出建议。

看起来你已经非常熟repeater的代码了,如果有更好的想法,也欢迎直接PR
PS: 支持TS那个issue拖了很久,这阵子也会着手去开发,十分抱歉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants