В гугле спроси, есть хорошие статьи, тут долго описывать
в гугле тонны воды абсолютно не той выдает
Bogdan
Bogdan
вот как с аполо клиентом, у него из коробки все есть и там можно указать , что делать, а в ридаксе такого ведь нету и больше гемора
Paul
всем привет, как лучше обработать isLoading, error, data в компоненте? тоесть если загрузка, показать спинер, данные есть их показать и тд, сделать хук, который вернет что то или условия лепить?
Не оч понял в чем вопрос. Ну isLoading в стейт, тут без вариантов
Paul
Data тоже
Mihail
Paul
Error - хз, зависит от того как хендлятся ошибки в приложении
Paul
Можно обернуть в хок, можно в хук
Paul
А можно все стейты в редакс запихнуть
Sergiy
всем привет.
Использую https://github.com/reactjs/react-tabs
Не получаеться изменить стили...
Пишу так же в своем файле scss, не меняються
Paul
1000500 варианов
Bogdan
Error - хз, зависит от того как хендлятся ошибки в приложении
как они могу еще хендлиться, бек вернул ошибку, ее в стейт же
Bogdan
Error boundary?
Bogdan
Error Boundaries - просто условие то же делает посути, только пердать обертку в хок нужно,
Vova
сделай hoc
Bogdan
сделай hoc
а что вернет хок? в нем условия напихать и он вернет уже все что нужно, что бы не лепить условия в компоненте?
Sergei
всем привет.
Использую https://github.com/reactjs/react-tabs
Не получаеться изменить стили...
Пишу так же в своем файле scss, не меняються
https://www.npmjs.com/package/react-web-tools
Sergiy
https://www.npmjs.com/package/react-web-tools
да это те же самые табы...
В инлайновых стилях мне нельзя стилизовать, только отдельным css файлом
Bogdan
Да
а если сделать хок, это плюс или роли не играет? типо поидее лоадер всегда одинаков, да и вывод ошибки тоже
artalar
https://www.npmjs.com/package/react-web-tools
1.6 kB - очень круто.
Добавьте примеры в codesandbox
P.S. название пакета очень плохое
Paul
а если сделать хок, это плюс или роли не играет? типо поидее лоадер всегда одинаков, да и вывод ошибки тоже
Ну зависит от того, сколько будет переиспользовний. Если много, то хок поможет
artalar
https://www.npmjs.com/package/react-web-tools
Это должно быть в peerDependencies https://github.com/polanskiy/react-web-tools/blob/master/package.json#L17
🦜
Это должно быть в peerDependencies https://github.com/polanskiy/react-web-tools/blob/master/package.json#L17
ты главное код исходников не смотри
artalar
хуки, в остальное не вглядывался
🦜
а, ну вот в остальном и дело
artalar
Там сборщика и транспайлера нет - вот это странно
artalar
@vaniaalexbuix вам сюда @javascript_jobs
Ivan
Eugene
const renderInputComponent = (inputProps) => {
const { inputRef = () => {}, ref, ...other } = inputProps
return (
<TextField
variant="outlined"
fullWidth
ref={nameRef}
InputProps={{
inputRef: (node) => {
ref(node)
inputRef(node)
},
endAdornment: (
<InputAdornment position="end">
<IconButton
edge="end"
onClick={handleClickAddSkill}
onKeyUp={handleClickAddSkill}
>
<PlusButton />
</IconButton>
</InputAdornment>
),
}}
{...other}
/>
)
}
подскажите, как здесь подписаться на onBlur?
Eugene
я добавил ref={nameRef}, но не работает
Eugene
не очень понятна реализация ref, inputRef в mui
Kurzdor
Там сборщика и транспайлера нет - вот это странно
react-scripts + babel
Загляните в pkg.scripts.compile
artalar
react-scripts + babel
Загляните в pkg.scripts.compile
Я посмотрел в dist, зачем оно тогда там...
Andrey
я имею в виду, мне надо по нажатию ESC вызывать blur
...
const input = useRef()
useOnEscape(() => input.current.blur());
return <TextField inputRef={input} />
хук для примера я дам
а реализацию не дам
Eugene
Eugene
в какой момент?
оно после рендера если что присвоится в реф
там InputProps уже есть в mui компоненте
Eugene
<TextField
inputRef={input}
variant="outlined"
fullWidth
InputProps={{
inputRef: (node) => {
ref(node)
inputRef(node)
},
endAdornment: (
<InputAdornment position="end">
<IconButton
edge="end"
onClick={handleClickAddSkill}
onKeyUp={handleClickAddSkill}
>
<PlusButton />
</IconButton>
</InputAdornment>
),
}}
{...other}
/>
ill-ya
Какой самый простой способ сгенерить CSR страницу с версткой на cra?
Anonymous
может кто объяснить почему запись вида
```
this.setState(state => (
state.editTourists.map( editTouristsItem => {
if (editTouristsItem.key === key) {
editTouristsItem.showEditModal = open;
}
return editTouristsItem;
} }))
равнасильна
this.setState(state => ({
editTourists: state.editTourists.map( editTouristsItem => {
if (editTouristsItem.key === key) {
editTouristsItem.showEditModal = open;
}
return editTouristsItem;
})
}))
в первом же случае возвращается только массив, мочему он заменяет именно editTourists
ill-ya
чтобы в индексе была верстка
Andrey
добавить свой код туда?
посмотреть, что если начать печатаь в инпуте, то он консольлогнет реф с элементом
применить полученные знания на практике
🦜
Подскажите, как убрать оперу из этого списка? not op_mini выдает ошибку
🦜
🤴👷♂️🦸♂️🧚♀️
Andrey
Frontend Priest
я имею в виду, мне надо по нажатию ESC вызывать blur
грязный хак:
document.activeElement.blur()
Evgeny
грязный хак:
document.activeElement.blur()
а вы точно Фронтенд пастор? искушаете слишком много
Eugene
окей, давай воспроизведение ошибки в кодсендбоксе)
https://codesandbox.io/s/affectionate-meninsky-s93gx
Ivan
РЕбят подскажите пожалуйста
Использую редаксформ
Создаю мапом таблицу с товарами, в роу с таблицами есть два чекбокса
После создания редаксформ не контролирует эти чекбоксы, не появляются их значения в стейте формы
Ivan
Ivan
RFField это Field редаксформы
Ivan
что я делаю неправильно?
Evgeny
Nikita
@itsjohncena
Eugene
https://codesandbox.io/s/affectionate-meninsky-s93gx
подскажите, как здесь ref правильно передать?