CODEWITHSUNDEEP
javascriptnode.jsreactjs
Kevin Nett
Kevin Nett

Reputation: 429

Warning: Unknown event handler property `onClick` in React.js web app

This is the part of the code involved in the error.

const Balance = () => {
     async function onGetBalance() {
         const balance = await client.api.network.getBalance({ address: 'AcyLq3tokVpkMBMLALVMWRdVJ83TTgBUwU' });
         alert('onGetBalance: ' + JSON.stringify(balance));
              };
    
    return(
    <Button onClick={onGetBalance}></Button>
    )
    };
    export default Balance;

The getbalance function communicates with an API of an online banking app and alerts the account balance.

The original file is a Typescript file and it is this:

export const Network: React.SFC<RouterProps> = (props) => {

async function onGetBalance() {
    const balance = await client.api.network.getBalance({ address: 'AcyLq3tokVpkMBMLALVMWRdVJ83TTgBUwU' });
    alert('onGetBalance: ' + JSON.stringify(balance));
  }
return (
    <div>
      <button onClick={onGetNetwork}>getNetwork</button>
</div>
);
};

The original file works, I guess it depends on props. I tried with:

const Balance = (props) => {...

but it does not work. Unfortunately the only examples of how to use the API are in Typescript and I am having some difficulties and have not found other solutions by googling.

Upvotes: 0

Views: 714

Answers (2)

Давит Дживанян
Давит Дживанян

Reputation: 1

I had the same problem. Apparently this error appears because of your IDE. When I wrote "onClick" myself, I got this error. But when I wrote "onC" and selected "onClick" in the tooltip menu, everything worked.

Upvotes: 0

Jay Motka
Jay Motka

Reputation: 214

This code looks correct(same as TypeScript file) but try debugging or console the value of balance to check if you are getting any value if you aren't than your API code has some problem and check that code.

Upvotes: 1

Related Questions