How to detect sapce key in Android device virtual Keypad through Web App (ReactJS)

Question

I am building a web app in ReactJS, where i want to call an API just after user hit space bar. i have tried several Events like (onKeyPress, onKeyUp, onKeyDown) but got same keycode for every key pressed except "enter" and "backspace". It is working fine in desktop but not in mobile devices. what should i do? Thanks in Advance.

Answer 1

You could do something like this if only capturing a space at the end of your input would be good enough.

import React, { useState } from "react";

export default () => {
  const onInputChange = ({
    target: { value }
  }): void => {
    if (value && value[value.length - 1] === " ") {
      // do stuff
    }
  };

  return <input onChange={onInputChange} />;
};