javascript - 如何使用 Chrome 的 React Developer Tools 扩展设置日期？

Question

我想使用 React Developer 工具的 ( version 4.13.2) 组件选项卡对我的 Provider 组件进行一些深入调试。

有问题的提供者将如下所示：

export const MyContext = createContext({});

export const MyContextProvider = ({ children }) => {
    const [selectedDate, setSelectedDate] = useState(new Date())
    const [selectedTime, setSelectedTime] = useState(null)

    const value = {
        selectedDate, setSelectedDate,
        selectedTime, setSelectedTime
    }
    return (
        <MyContext.Provider value={value}>
            {children}
        </MyContext.Provider>
    )

}

我正在为字符串和数字输入不同的状态值，并观察它们按预期反映在 UI 上。但是我遇到的一个问题是这些值之一是日期。

当我第一次访问该工具时，它如下图所示：

如果我尝试编辑它，它将不允许我这样做，这与它的selectedTime对应项不同，它是一个字符串，我可以将任何我想要的值放入其中并相应地查看 UI 更新。

我试图改写日期字段，但无法获得要在其位置使用的有效日期。值错误，如下所示：

所以我的问题是，是否可以通过扩展的这一部分输入日期值？我怎么能这样做？

PS：很抱歉使用截图，因为这是来自扩展，字段的复制和粘贴没有意义。

标签： javascriptreactjsreact-devtools