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

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -