Javascript 未渲染的子组件

我一辈子都搞不明白为什么我的组件根本不在页面中呈现，它的呈现方式是

。我使用的是

react表单

，但我认为这与不渲染无关

signin.js

import React from 'react';
import { connect } from 'react-redux';
import { NavLink } from 'react-router-dom'
import {BlockForLoggedInUsers} from '../shared/auth/userRedirects'
import Logo from '../shared/logo';
import userStyles from '../shared/userPages/userPages.css';
import showResults from './showResults';
import signInForm from './signInForm';

class SignIn extends React.Component {
  constructor(props) {
    super(props);
  }

  render(){
    return (
      <div className={userStyles.home}>
        <BlockForLoggedInUsers />
        <Logo />
        <signInForm onSubmit={showResults}/>
        <div className={userStyles.extraDetails}>
          <NavLink to="/signup">Don't have an account yet?</NavLink>
          <NavLink to="/skip" className={userStyles.extraDetailsRight}>Skip</NavLink>
        </div>
      </div>
    );
  }
}

function mapStateToProps(state) {
  return { user: state.user };
}

export default connect(mapStateToProps)(SignIn);

import React from 'react';
import { Field, reduxForm } from 'redux-form';

const signInForm = props => {
  const { handleSubmit, pristine, submitting } = props;
  return (
    <div>
      <form role="form" onSubmit={handleSubmit}>
        <Field name="email" component="input" type="text" placeholder="Enter email address"/>
        <button type="submit"  disabled={pristine || submitting}>Sign In</button>
      </form>
    </div>
  );
};

export default reduxForm({
  form: 'signInForm',
})(signInForm);

从“React”导入React；
从'react redux'导入{connect}；
从“react router dom”导入{NavLink}
从“../shared/auth/userRedirects”导入{BlockForLoggedInUsers}
从“../shared/Logo”导入徽标；
从“../shared/userPages/userPages.css”导入用户样式；
从“/showResults”导入showResults；
从“/signinfo”导入signinfo；
类签名扩展了React.Component{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
你还没有账户吗？
跳过
);
}
}
函数MapStateTops（状态）{
返回{user:state.user}；
}
导出默认连接（MapStateTops）（登录）；

signinfo.js

import React from 'react';
import { connect } from 'react-redux';
import { NavLink } from 'react-router-dom'
import {BlockForLoggedInUsers} from '../shared/auth/userRedirects'
import Logo from '../shared/logo';
import userStyles from '../shared/userPages/userPages.css';
import showResults from './showResults';
import signInForm from './signInForm';

class SignIn extends React.Component {
  constructor(props) {
    super(props);
  }

  render(){
    return (
      <div className={userStyles.home}>
        <BlockForLoggedInUsers />
        <Logo />
        <signInForm onSubmit={showResults}/>
        <div className={userStyles.extraDetails}>
          <NavLink to="/signup">Don't have an account yet?</NavLink>
          <NavLink to="/skip" className={userStyles.extraDetailsRight}>Skip</NavLink>
        </div>
      </div>
    );
  }
}

function mapStateToProps(state) {
  return { user: state.user };
}

export default connect(mapStateToProps)(SignIn);

import React from 'react';
import { Field, reduxForm } from 'redux-form';

const signInForm = props => {
  const { handleSubmit, pristine, submitting } = props;
  return (
    <div>
      <form role="form" onSubmit={handleSubmit}>
        <Field name="email" component="input" type="text" placeholder="Enter email address"/>
        <button type="submit"  disabled={pristine || submitting}>Sign In</button>
      </form>
    </div>
  );
};

export default reduxForm({
  form: 'signInForm',
})(signInForm);

从“React”导入React；
从“redux form”导入{Field，reduxForm}；
const signinfo=props=>{
const{handleSubmit，pristine，submiting}=道具；
返回(
登录
);
};
导出默认reduxForm({
表格：“SignInfo”，
})（signinfo）；

HTML输出

---

组件名称应大写-因此只需将组件名称从

signinfo

更改为

signinfo

。请检查react以了解更多详细信息。

react组件名称应大写-因此只需将组件名称从

SignInfo

更改为

SignInfo

。请查看react以了解更多详细信息。

我认为这个答案可以解决这里的问题。我认为这个答案可以解决这里的问题。宾果！简单正确的答案如下：D@JamieHutber，这是上面答案的副本：）宾果！简单正确的答案如下：D@JamieHutber，这是上述答案的副本：）