reactjs - React.js inline function getting error onClick: TypeError: _this2.<function-name> is not a function -
i'm stuck on simple issue when click on button, i'm trying fire multiple functions @ same time, inside of onclick
event on button. however, when try this, error:
uncaught typeerror: _this2.removelocation not function
here function:
const renderlocations = ({ fields, meta: { touched, error, submitfailed } }) => { return ( <div> <div classname={styles.contactinfosection}> <h2>locations</h2> <div> <button type="button" classname={styles.add} onclick={() => fields.push({})}>add location</button> {(touched || submitfailed) && error && <span>{error}</span>} </div> </div> <ul classname={styles.locationslist}> {fields.map((location, index) => <li classname={styles.locationcard} key={index}> <div> <field name={`${location}.street`} hinttext="street" component={textfield} label="street"/> <field name={`${location}.city`} hinttext="city" component={textfield} label="city"/> <field name={`${location}.state`} hinttext="state" component={textfield} label="state"/> <field name={`${location}.zip`} hinttext="zip" component={textfield} label="zip"/> </div> <button type="button" title="remove" onclick={() => { fields.remove(index); this.removelocation(); }}>remove</button> </li> )} </ul> </div> ); }
i'm trying fire function inside component looks this:
export class managecustomerform extends react.component { constructor(props) { super(props); //this.removelocation = this.removelocation.bind(this); } removelocation() { console.log('remove location?'); this.props.removelocation(); } }
does know issue here is?
so did converted inline function a defined function inside of component access inside of same component.
Comments
Post a Comment