无法访问对象

Question

的道具的子组件能够当它被夷为平地，进入状态 -

this.state = { 
     name: '', 
     email: '' 
}; 

而下面的视图代码

<Form 
     handleFormChange={this.props.handleFormChange} 
     name={this.props.name} 
     email={this.props.email} /> 

但当状态的构成嵌套的方式组件无法访问它

this.state = { 
     company: { 
      name: '', 
      email: '' 
     } 
    } 

与此相应的视图代码

<Form 
     handleFormChange={this.props.handleFormChange} 
     name={this.props.company.name} 
     email={this.props.company.email} /> 

据指出 “无法读取的不确定（...）属性 '名'”

全成分： company.js

export default class Company extends React.Component { 
     constructor(props) { 
      super(props); 
      this.state = { 
       company: { 
        name: '', 
        email: '' 
       } 
      }; 
     }; 
     render() { 
      return (
        <AddCompanyModal 
         activeAddDialog={this.state.activeAddDialog} 
         addDialog={this.addDialog} 
         saveData={this.saveData} 
         handleFormChange={this.handleFormChange} /> 
      ) 
     } 
    } 

addCompanyModal.js

export default class AddCompanyModal extends React.Component { 

    render() { 
     return (
      <Dialog 
       active={this.props.activeAddDialog} 
       onEscKeyDown={this.props.addDialog} 
       onOverlayClick={this.props.addDialog} 
       title='Add Company Information' 
       > 
       <CompanyForm 
        handleFormChange={this.props.handleFormChange} /> 
      </Dialog> 
     ) 
    } 
} 

个

CompanyForm.js

export default class CompanyForm extends React.Component { 
    render() { 
     return (
      <section> 
       <Input 
        icon='business' 
        type='text' 
        label='Name' 
        name={this.state.company.name} 
        value={this.state.company.name} 
        onChange={this.props.handleFormChange.bind(this, 'name')} /> 
      </section> 
     ) 
    } 
} 

Answer 1

你混的道具和状态。

<Form 
    handleFormChange={this.props.handleFormChange} 
    name={this.state.company.name} 
    email={this.state.company.email} />