無法訪問對象

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} />