Javascript 如何避免在安卓系统中重新购买相机？

所以问题是我在使用react原生qrcode扫描器，当我在我的应用程序中切换标签时，Android中的QR扫描器会变黑。我阅读它是因为在安卓系统中，组件不会卸载。我不得不添加一个isFocused if语句，但它导致了整个事件的重播，这是一个糟糕的用户体验。有没有一种方法可以在不使用if语句的情况下使其更好？谢谢

import { withNavigationFocus } from 'react-navigation';

class ScannerScreen extends Component {
  ...
  const { isFocused } = this.props
  ...

  {isFocused ? 
    <QRCodeScanner
      showMarker={true} 
      vibrate={false}
      ref={(camera) => {this.state.scanner = camera}}
      cameraStyle={{overflow: 'hidden', height: QRHeight}}
      onRead={read}
      bottomContent={<BottomQRScanner/>}
    />
    :
    null
  }
}

export default withNavigationFocus(ScannerScreen)

从“反应导航”导入{withNavigationFocus}；
类ScannerScreen扩展组件{
...
const{isFocused}=this.props
...
{我的注意力集中了吗？
{this.state.scanner=camera}
cameraStyle={{溢出：“隐藏”，高度：QRHeight}
onRead={read}
bottomContent={}
/>
:
无效的
}
}
使用NavigationFocus导出默认值（ScannerScreen）

好的，您可以在componentdidmount/componentwillmount&删除componentwillunmount或useeffecthook中的listner

useEffect(() => {
      const unsubscribe = navigation.addListener('willFocus', () => {
       //Your function that you want to execute
      });

      return () => {
        unsubscribe.remove();
      };
  });

或者在新版本中，只需这样做

从“react navigation”导入{NavigationEvents}

用这个

<NavigationEvents onDidFocus={() => console.log('I am triggered')} />

console.log（“我被触发”）}>

---

每当页面进入焦点时，将调用onDidFocus事件。

好的，您可以将此添加到componentdidmount/componentwillmount&删除componentwillunmount或useeffecthook中的listner

useEffect(() => {
      const unsubscribe = navigation.addListener('willFocus', () => {
       //Your function that you want to execute
      });

      return () => {
        unsubscribe.remove();
      };
  });

或者在新版本中，只需这样做

从“react navigation”导入{NavigationEvents}

用这个

<NavigationEvents onDidFocus={() => console.log('I am triggered')} />

console.log（“我被触发”）}>

---

onDidFocus事件将在页面聚焦时被调用。

嗨，我也遇到了同样的问题，所以我在模式（

react native Modal

）视图中添加了QRCodeScanner，然后显示和隐藏模式，我想这可能有助于解决您的问题。我认为您的问题与这里良好的用户体验更相关，也许看看它在本机移动应用程序中是如何处理的，然后你可以找到一种好的uxHi方法。我也有同样的问题，所以我在一个模态（

react native model

）视图中添加了QRCodeScanner，然后显示和隐藏模态，我认为这可能会帮助你解决问题。我认为你的问题更多地与良好的用户体验相关，也许看看它在本地移动应用程序中是如何处理的，然后你就可以找到一个好方法了。谢谢你的回复，我以前也这么做过，但问题是，在安卓系统中，相机会被卡住，在这种情况下，你可以检查这一点，在函数中有一个变通方法render react native camera，并将其称为onDidFocus，在它加载camera之前，你可以在加载程序状态更改时显示加载程序启用camera组件。因此，最后它与我上面的代码类似，我只是想知道有多大/著名的应用程序可以处理这个问题。谢谢你的回复谢谢你的回复，我以前也这么做过，但问题是安卓系统的摄像头会被卡住，在这种情况下，你可以检查这一点，在函数中有一个变通方法render react native camera，并将其称为onDidFocus，在它加载camera之前，你可以在加载程序状态更改时显示加载程序启用camera组件。因此，最后它与我上面的代码类似，我只是想知道有多大/著名的应用程序可以处理这个问题。谢谢大家