如何防止react-dates在焦点上打开？

Question

我使用的是react-dates。日历的可见性由聚焦的道具控制。当在网站上使用标签时，我不想打开日历，我想让它在enter键上打开。有没有办法做到这一点？谢谢!

Answer 1

你应该控制"focused“属性和onFocusChange方法。还要将侦听器设置为container。例如

.....
  const [focusedInput, setFocusedInput] = useState(null);

  const handleUserKeyPress = (evt) => {
    if (evt.keyCode === 13 && !evt.shiftKey) setFocusedInput(true);
  };
....

    <div onKeyUp={handleUserKeyPress}>
      <SingleDatePicker
        focused={focusedInput} 
        onFocusChange={({ focused }) => {
          const focus = focusedInput && focused ? true : false;
          setFocusedInput(focus);
        }} 
        .....
      />
</div>
.....