Tengo una clase que contiene la clase Componente.
Cuando proporciono un accesorio onClick para que lo use e intento pasar una función, aparece el siguiente error:
AddForm.js: 74 TypeError no detectado: _this3.props.onClick no es una función
Código:
export default class Company extends React.Component { constructor(props) { super(props); this.state = { AddOrView: <AddForm header="Add User" formFields={this.fields} />, users: this.props.initialUsers } } handleAdd() { console.log('Hello World'); } render() { return ( <AddWithTitle onClick={e => this.setState({ AddOrView: <AddForm header="Add User" formFields={this.fields} formResponses="" onClick={this.handleAdd} /> }) } src="blah.png"> Add User</AddWithTitle> ); } } export default class AddForm extends React.Component { render() { return( <button className="btn btn-primary" formResponses={this.state.fieldValues} onClick={() => this.props.onClick()} > Save </button> ); } }; <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>Gracias por tu ayuda :)
Debe vincular la función a su componente de nivel superior para que active lo que quiera que active en el método onClick .
<AddWithTitle onClick={e => this.setState({ AddOrView: <AddForm header="Add User" formFields={this.fields} formResponses="" onClick={this.handleAdd.bind(this)} /> }) } src="blah.png"> Add User</AddWithTitle>