react-native - 如何关闭@react-native-community/datetimepicker

Question

有没有办法关闭以前打开的实例@react-native-community/datetimepicker？我想在componentWillUnmount或使用setTimeout或其他一些事件中关闭它。不幸的是，即使组件被移除，本机选择器仍保持打开状态。我试过这样的事情：

function example() {
  const [showPicker, setShowPicker] = useState(false);

  setTimeout(() => {
    setShowPicker(!showPicker);
  }, 5000);

  return (
    <>
      {showPicker && (
        <DateTimePicker mode="date" value={new Date()} />
      )}
    </>
  );
}

这使得选择器每 10 秒打开一次，但需要手动关闭。有什么方法可以直接从代码中关闭它（而不是由用户）？

标签： react-native

Answer 1

试试这个可能会有所帮助

import React, { useEffect } from 'react'

function example() {
  
  const [showPicker, setShowPicker] = useState(false);

  useEffect(() => {
     setShowPicker(true);

     // returned function will be called on component unmount 
     return () => {
       setShowPicker(false)
     }
  }, []);    

  return (
    <>
      {showPicker && (
        <DateTimePicker mode="date" value={new Date()} />
      )}
    </>
  );
}

您可以在 Hooks 中检查ComponentWillMount