Ну впринципе да, только я не понял зачем ты меняешь состояние сразу после того как компонент в первый раз вызывается? Он же при следующем вызыве сделает запрос

1.
App() { 
  const data = useSelector(state => state.data)
  retrurn ( <Section data={data} />)
}  

Section({ data }) { 
  const section = data.section
  retrurn ( <Section section={section} /> )
}  

2.
App() { 
  const data = useSelector(state => state.data)
  retrurn ( <Section data={data} />)
}  

Section({ data }) { 
  const section = useSelector(state => state.data.section)
  retrurn ( <Section section={section} /> )
}

Сам селектор всегда выноси в отдельную функцию

Изначальное состояние компонента true и при рендере его, будет проверяться условие, если true, он изменит на false, а если будет false уже, то он при изменении state будет просто запускать функцию

Друзья всем привет, кто работал с Redux-toolkit требуется помощь. Я пытаюсь написать свою кастомную функцию которую буду передовать при вызове PayloadCreator в Async Thunk, пример:



export const updateCurrentBrand = createAsyncThunk('brand/updateCurrentBrand', protectRequest(brandApi, 'POST'))


Тело функции protectRequest:


export const protectRequest = (url: string, method: string) => {
   return ({id, data}: any, thunkAPI: any) => {
       fetch(url + (id ? id : ''), {
           method: method,
           body: JSON.stringify(data),
           signal: thunkAPI.signal,
           headers: {
               "X-Requested-With": "XMLHttpRequest",
               'Accept': 'application/json',
               'Content-Type': 'application/json'
           }
       })
           .then(async (response) => {
               console.log(thunkAPI.signal)
               try {
                   const data = await response.json();
                   if (response.status === 200) {
                       return data
                   }
                   if (response.status === 400) {
                       return thunkAPI.rejectWithValue(data)
                   }
               }
               catch(err) {
                   let error = err
                   if (!error.response) {
                       throw err
                   }
                   return thunkAPI.rejectWithValue(response)
               }

           })
   }
}

В документации есть пример для обратки ошибок уже в компоненте, в моем случае ошибки не попадает и приложение думает что все хорошо, пример проверки в компоненте:

formikHelpers.validateForm(newValues)
   .then( async () => {
       const resultAction: any = await dispatch(updateModelupdateModel({id, data: values}))
       if (updateModelupdateModel.fulfilled.match(resultAction)) {
           enqueueSnackbar('Модель успешно обновлена', {variant: 'success'})
           dispatch(getBrandgetBrand())
           goBack()
       } else {
           if (resultAction.payload) {
               const errorMessage: string = resultAction.payload.data.errors.title
               // Being that we passed in ValidationErrors to rejectType in `createAsyncThunk`, those types will be available here.
               formikHelpers.setSubmitting(false)
               enqueueSnackbar(`Ошибка:${errorMessage}, модель была обновлена ранее`, {variant: 'error'})
               goBack()
           }
       }
   })

Как в данном случае обработать ошибки с  сервера, заранее спасибо

вот так может будет удобнее

А можешь объяснить для чего? Кажется, в случае, когда там простой селектор, это необязательно

Добрый день, подскажите где проблема в коде может быть? Задача- нужно при открытой модалке запретить ввод с клавиатуры иначе разрешить

или мб я как то не так обработчик навешиваю, в общем любые предложения

Будут сложности с тестами и рефакторингом, нужно максимально разделять ответственности

не поспоришь

будут сложности с "а давайте порефакторим и поменяем место, где это значение живет в стейте. ну-ка, где мы используем это значение в компонентах?"

ребят хоть какие то мысли?

да, я уже понял, но спасибо, что разжевал )

👍
просто слишком часто такое видел)

либо может быть я зря вешаю обрабочик на window и надо на div вешать и фокусами ловить?

не понимаю что тебе нужно?

зачем блокировать клавиатуру?

нужно запретить ввод с клавиатуры в момент открытого попапа

приложение скорости печати