如何使用window.open onClick-reactjs

Question

I want to use window.open but I got this error message:

Uncaught Error: Expected onClick listener to be a function, instead got type string

---

my code:

<img id='drftrgvlnbpewmcswmcs' style={{cursor:'pointer'}} onClick='window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup","toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30")' alt='' src='http://trustseal.enamad.ir/logo.aspx?id=15288&p=lznbfujyqesgukaqukaq'/>

Answer 1

You can't put plan string in onClick prop. You have to pass a function.

Example

<img id='drftrgvlnbpewmcswmcs' style={{cursor:'pointer'}} onClick={() => window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup","toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30")} alt='' src='http://trustseal.enamad.ir/logo.aspx?id=15288&p=lznbfujyqesgukaqukaq'/>

Answer 2

As it says Uncaught Error: Expected onClick listener to be a function, instead got type string

It should be a function. So you can do the followings

openMyWindow = () => {
 window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup","toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30")
}

and use it like

<img id='drftrgvlnbpewmcswmcs' style={{cursor:'pointer'}} onClick={this.openMyWindow} alt='' src='http://trustseal.enamad.ir/logo.aspx?id=15288&p=lznbfujyqesgukaqukaq'/>

or of course this way as mentioned in other answers

onClick={() => {
    window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup", "toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30")
  }}

Answer 3

You need to enclose your code with a function. For example:

<img
  id='drftrgvlnbpewmcswmcs'
  style={{ cursor: 'pointer' }}
  onClick={() => {
    window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup", "toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30")
  }}
  alt=''
  src='http://trustseal.enamad.ir/logo.aspx?id=15288&p=lznbfujyqesgukaqukaq'
/>

Answer 4

i hope the code can be usefull for you

 <img
      id='drftrgvlnbpewmcswmcs' 
      style={{cursor:'pointer'}} 
      onClick={()=>{ window.open("http://trustseal.enamad.ir/Verify.aspx?id=15288&p=nbpdyncrwkynaqgwaqgw", "Popup","toolbar=no, location=no, statusbar=no, menubar=no, scrollbars=1, resizable=0, width=580, height=600, top=30") }} 
      alt=''
      src='http://trustseal.enamad.ir/logo.aspx?id=15288&p=lznbfujyqesgukaqukaq'
 />