一些React的语法问题

最近基本Ant Design Pro做一个后台管理系统,里面有一些语法看不明白
项目里有一个login父组件,里面引入了一个loginSubmit子组件也就是登录按钮
// login
image.png
login的render方法:
render() {

const { className, children } = this.props;
const { type, tabs = [] } = this.state;
const TabChildren = [];
const otherChildren = [];
React.Children.forEach(children, child => {
  if (!child) {
    return;
  }

  if (child.type.typeName === 'LoginTab') {
    TabChildren.push(child);
  } else {
    otherChildren.push(child);
  }
});
return (
  <LoginContext.Provider value={this.getContext()}>
    <div className={classNames(className, styles.login)}>
      <Form onSubmit={this.handleSubmit}>
        {tabs.length ? (
          <React.Fragment>
            <Tabs
              animated={false}
              className={styles.tabs}
              activeKey={type}
              onChange={this.onSwitch}
            >
              {TabChildren}
            </Tabs>
            {otherChildren}
          </React.Fragment>
        ) : (
          children
        )}
      </Form>
    </div>
  </LoginContext.Provider>
);

}
// loginSubmit
WX20200115-100409@2x.png
主要问题就是:
1、login里面引入了loginSubmit 然后赋值给了static Submit,这个子组件也没有被调用就能渲染出来,还可以收到{...rest}参数,这是为什么呢
2、login里面通过defaultProps申明了一些默认属性,比如defaultActiveKey,但是它又在state里被赋值给了type,在其它地方也没有用到了,这样做有什么意义呢,为什么不直接在state里申明
3、上面loginSubmit里的Button组件还可以这么写
image.png
上面的写法就是给Button添加了一个children属性,跟这种写法是一样的吗

阅读 443
评论
    2 个回答

    1.loginSubmit 是一个单独的组件,在login组件中赋值给 其中的一个静态属性的作用 是为了分类吧。 比如你要用到 loginSubmit的时候 可以直接从login组件获得。

    1. 这个问题 2个不是一样的吗 都是传递了children给Button组件

      login组件的render方法可以贴一下吗

        撰写回答

        登录后参与交流、获取后续更新提醒