OnClick not working properly on mobile devices with React JS and webpack-CodePudding

I'm working on a login page with Webpack, React and Redux, in addition I'm using bootstrap as css framework.

Everything works fine except on mobile, when i click on a button the onClick event triggers on both mobile and desktop but on the former React does not work properly:

The button remains in the down state and returns in the normal state only after a click on an other button.

<button className='btn' onClick={() =>loginClick()} style={{zIndex: 100}}>LOGIN</button>

Here is the click handler:

const loginClick = () => {
    alert("I am an alert box A!");
    const payload = {psw: password, usr: username, keepLogged: keepLogged};
    store.dispatch(tryLogin(payload));
    alert("I am an alert box B!");
}

As said before on the desktop I can login and be redirected to the homepage, on mobile devices, even with the iOS emulator, both alerts are displayed but nothing is dispatched to the store and the button remains in the pressed state until i click on a different button, which behaves in the same manner even if it has no onClick prop.

I've tried in both development and production mode in webpack.

Any suggestions?

CodePudding user response：

use onPointerEnter instead of onClick