Как отложить SplashScreen Redux Persist Gate?
Я использую Redux и Redux-Persist для сохранения некоторых пользовательских данных при закрытии приложения.
Существует опция загрузки, которую вы настраиваете в PersistGate, где вы можете указать экран загрузки, который будет отображаться, пока Redux-Persist собирает сохраненные данные.
Проблема в том, что этот экран появляется и исчезает слишком быстро, и я хотел бы увидеть его на пару секунд.
Есть ли форма для отсрочки перехода экрана загрузки? Вот мой код, точка входа в приложение:
class App extends Component {
render() {
return (
<Provider store = {store}>
<PersistGate loading = { <SplashScreen />} persistor = {persistor}>
<Routes />
</PersistGate>
</Provider>
);
}
}
Ответы 2
Не знаю, полностью ли это соответствует вашим потребностям, но, возможно, вы можете использовать следующий обходной путь, используя событие onBeforeLift, чтобы вызвать действие непосредственно перед подъемом ворот, чтобы установить условный рендеринг с фиксированным таймаутом.
class App extends Component {
state = {
gateLifted: false
}
onBeforeLift = () => {
// Take an action before the gate lifts
setTimeout(() => {
this.setState({ gateLifted: true})
}, 3000);
}
render() {
return (
<Provider store = {store}>
<PersistGate persistor = {persistor} onBeforeLift = {this.onBeforeLift}>
{ this.state.gateLifted ? <Routes /> : <SplashScreen />}
</PersistGate>
</Provider>
);
}
}Для всех, кто хочет это сделать, вы можете использовать это:
class App extends Component {
render() {
return (
<Provider store = {store}>
<PersistGate
loading = {<SplashScreen />}
persistor = {persistor}
onBeforeLift = {() => new Promise(resolve => setTimeout(resolve, 3000))}
>
<Routes />
</PersistGate>
</Provider>
);
}
}
Спасибо за этот фрагмент кода, который может предоставить некоторую немедленную помощь. правильное объяснение значительно улучшит его долгосрочную ценность, показывая, почему это хорошее решение проблемы, и сделает его более полезным для будущих читателей с другими, похожими вопросами. Пожалуйста, редактировать свой ответ, чтобы добавить некоторые пояснения, включая сделанные предположения.
Спасибо, я попробую