React - enter search with onKeyPress

0 votes
74 views
added Mar 18 in React by lcjr First Warrant Officer (11,830 points)
const MyApp = () => {
  
  const handleKeyPress = (e) => {
    if (e.key === 'Enter') {
      handleAsk();
    }
  };
  
  //in JSX
  <input
    css={buddyField}
    className="buddyField"
    type="text"
    placeholder="Ask us anything..."
    value={inputValue}
    onChange={handleInputChange}
    onKeyPress={handleKeyPress} 
    onFocus={() => setIsInputFocused(true)}
    onBlur={() => setIsInputFocused(false)}
  />
  
  <button className="buddySearch_send" onClick={handleAsk}>
    <img
      src="http://media.edgeprop.my/assets/icons/send_24.png"
      alt="Send"
    />
  </button>

 

lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...