window.onblur 事件在反應 js 中沒有被調用 android webview

Question

下面給出的代碼在 PC、筆記本電腦、Tab 和移動瀏覽器中完美運行。 此代碼檢測用戶是否正在打開另一個選項卡或其他文檔或失去當前瀏覽器 window 的焦點。但是如果我們使用此代碼使用 android web-view 構建一個 web 應用程序，那么這根本不起作用。

import React,{useEffect} from 'react';

function App() {
useEffect(() =>
{
const onBlurCallback = () => onBlur();
window.addEventListener('blur', onBlurCallback);
return () =>
{
window.removeEventListener('blur', onBlurCallback);
};
}, []);

return (
<div className="App">

</div>
);
}

function onBlur()
{
alert('hello');
}

export default App;

請提出一個也適用於 android 網絡視圖的解決方案。

Answer 1

您不需要像 React 中那樣使用addEventListner進行模糊處理。 您可以這樣嘗試：

<input type="text" onBlur={()=> //... your function here} />

Answer 2

推薦鏈接：官方文檔

您可以通過將onBlur function 添加為<input />的屬性來使用它。

function Example() {
  return (
    <input
      onBlur={(e) => {
        console.log('Triggered because this input lost focus');
      }}
      placeholder="onBlur is triggered when you click this input and then you click outside of it."
    />
  )
}