Віталій
useCallback(() => { ... }, [open, close])
Віталій
или ты без хуков?
Alexander
С хуками
Alexander
Ща чекну
Alexander
Да, норм вариант, спасибо)
Віталій
реально заработало? я от балды написал 😂
Віталій
но вообще уже привык все оборачивать в useMemo и useCallback, иначе начинается магия
Alexander
Ну useCallback кэширует функцию, поэтому ссылка не меняется при рендере 👍
Artem
Друзья привет
Artem
Подскажите пожалуйста, бьет ошибку node, типа порт 3000 уже работает
Artem
Заметил что локалхост не перезагружает страницу
Artem
Решил заново npm start написать, и бьет такую штуку
Artem
Решил проблему!
Artem
уже не нужна помощь
Ula
Вот так стейт можно менять?
this.setState({
blocks:
this.state.blocks.map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...this.state.blocks[indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
})
})
Den
`this.setState(prevState => {
// use prevState
})`
Alexey
setState(lastState => ({...}))
Eugene
а если сначала обработать и создать типа const block = kek
this.setState( {block })
Bogdan
кто в ридакс форм шарит, каким образом initialValues работает? типо как не передав начальный стейт навешиваются обработчики?
Alexey
колбэки платные?
Ula
то есть так?
this.setState(prevState => ({
blocks:
prevState.blocks.map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...prevState.blocks[indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
})
}))
Bogdan
кто в ридакс форм шарит, каким образом initialValues работает? типо как не передав начальный стейт навешиваются обработчики?
тоесть типо есть форма, и стейт формируется именно по полям в форме, как, в какую сторону смотреть вообще?
Den
то есть так?
this.setState(prevState => ({
blocks:
prevState.blocks.map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...prevState.blocks[indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
})
}))
Ну это гораздо лучше, но еще лучше подготовить объект заранее как выше прокоментили. До вызова this.setState()
Alexey
это кому? если мне то, почему не используете «ответить»?
я в метро с телефона, мне лень :(
Успішний Андрій
Какой из этих методов лучше использовать:
this.setState({ messages: this.state.messages.push(d.data) }) или this.setState({ messages: [...this.state.messages, d.data] })?
Den
Я думаю, ни один из предложенных.
Dmytro
Bogdan
Какой из этих методов лучше использовать:
this.setState({ messages: this.state.messages.push(d.data) }) или this.setState({ messages: [...this.state.messages, d.data] })?
первый мутирует, второй вернет новый вроде как
Ula
Ну это гораздо лучше, но еще лучше подготовить объект заранее как выше прокоментили. До вызова this.setState()
а это я не понял как сделать
Alexey
оба нелепые
либо колбэк, либо заранее объект мастерить надо
Den
а это я не понял как сделать
Ну типа, последняя строка должна быть this.setState({ blocks: newBlocks });
Bogdan
оба нелепые
либо колбэк, либо заранее объект мастерить надо
везде видел спред, колбек наверное еще не видел
Bogdan
или ты имеешь ввиду в setState колбек?
Alexey
везде видел спред, колбек наверное еще не видел
в setState обращаться к this.state - за такое бить надо, наверное
Ula
Ну типа, последняя строка должна быть this.setState({ blocks: newBlocks });
const blocks = (prevState => ({
blocks:
prevState.blocks.map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...prevState.blocks[indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
})
}))
this.setState({blocks}) это имеете ввиду?
Bogdan
в setState обращаться к this.state - за такое бить надо, наверное
так он не про это спрашивал, а про пуш либо спред
Alexey
или ты имеешь ввиду в setState колбек?
у сетстейт есть 2 формы - принимает либо объект либо функцию, у которой аргумент - предыдущий для генерируемого сьейта и которая возвращает новый стейт
Den
const blocks = (prevState => ({
blocks:
prevState.blocks.map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...prevState.blocks[indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
})
}))
this.setState({blocks}) это имеете ввиду?
const newBlocks = [...this.state.blocks].map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...this.state.blocks][indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
}))
this.setState({ blocks: newBlocks })
;
Bogdan
у сетстейт есть 2 формы - принимает либо объект либо функцию, у которой аргумент - предыдущий для генерируемого сьейта и которая возвращает новый стейт
я понял, я про вопрос, он не то спрашивал
Den
А что такое indexBlock - я не понял.
Ula
const newBlocks = [...this.state.blocks].map((block, i) => {
if (i === indexBlock) {
block["questions"] = [
...this.state.blocks][indexBlock].questions,
{ "text": "" }
]
return block
} else {
return block
}
}))
this.setState({ blocks: newBlocks })
;
это специально в одном месте […this.state.blocks] а в другом …prevState ?
Den
это специально в одном месте […this.state.blocks] а в другом …prevState ?
не, я поправил, что увидел
Ula
А что такое indexBlock - я не понял.
я динамически добавляю блоки, в них вопросы (инпуты для ввода вопросов), indexBlock это номер блока, чтобы вопросы добавлялись в него
MVD
как мне в deps useCallback передать массив объектов?
Alexey
так он не про это спрашивал, а про пуш либо спред
да без разницы, как модифицировать объекты, если иммутабельность не нужна
MVD
[array]
Он приходит из редакса и не изменяется. В итоге новый колбэк не получаю, если просто его передать
Den
я динамически добавляю блоки, в них вопросы (инпуты для ввода вопросов), indexBlock это номер блока, чтобы вопросы добавлялись в него
индекс - худший вариант для идентификации блока, лучше id
Bogdan
да без разницы, как модифицировать объекты, если иммутабельность не нужна
как я слышал, пуш типо не рекомендуется, как минимум если у тебя пьюркомпонент, пуш не вызовет перерендер
Den
Bogdan
может Immutable?
причем тут это? я имел ввиду пьюре который ссылки сравнивает, пуш не меняет ссылку, перерендера не будет
Ula
индекс - худший вариант для идентификации блока, лучше id
они вроде как должны идти по порядку, если в середине пропадет, то следующий становится на его место. это имеет значение?
Alexey
как я слышал, пуш типо не рекомендуется, как минимум если у тебя пьюркомпонент, пуш не вызовет перерендер
пьюр проверяет !== в sCU
обычный просто возвращает true
соот-но, если адрес объекта в памяти не поменяется, пьюр вернёт false и ничего не произойдёт
Bogdan
Den
они вроде как должны идти по порядку, если в середине пропадет, то следующий становится на его место. это имеет значение?
Даже не знаю, как кратко ответить. Лучше не привыкать к индексам.
Bogdan
Даже не знаю, как кратко ответить. Лучше не привыкать к индексам.
Например индекс хуже тем, что при сортировке листа например, используя индекс, ты удалишь не тот елемент, на который нажал
MVD
codepan можно?
Bogdan
это как?
ну было у тебя 3 елемента 1/2/3 индексы, отфильтруешь список, останется например елемент 3, его индекс вместо 3 станет 1, при удалении ты удалишь елемент с индексом 1, а не 3
Frontend Priest
ну было у тебя 3 елемента 1/2/3 индексы, отфильтруешь список, останется например елемент 3, его индекс вместо 3 станет 1, при удалении ты удалишь елемент с индексом 1, а не 3
Не обязательно. После сортировки всё ещё будет мапаться массив элементов с индексами от 0 до N
Bogdan
Не обязательно. После сортировки всё ещё будет мапаться массив элементов с индексами от 0 до N
я опечатался, не сортировка, а фильтр
Bogdan
сделай самый нищий туду, и попробуй, индекс подведет, я помню сделал так, потом одуплил что индекс то меняется
Frontend Priest
я опечатался, не сортировка, а фильтр
Если фильтровать не при рендере, то всё ещё будет окей
Frontend Priest
Я против индексов, но часто проще юзать их, чем какие-то айди
Dmitry
гайс поле intent какую логику несет ?
Ula
Даже не знаю, как кратко ответить. Лучше не привыкать к индексам.
это получается мне нужно ввести id? его в объект this.state.block прям добавить и увеличивать на один?
Den
это получается мне нужно ввести id? его в объект this.state.block прям добавить и увеличивать на один?
Тебе бэкенд будет возвращать блок с полем id. Если хардкодишь список или формируешь его в фронта - создавай в нем уникальный id. Например с помощью функции getUUID()
Anastasya
На крайний случай можно использовать любую уникальную строку в качестве ключа, например, если мэпа цветов, можно использовать ключ - название цвета
Anastasya
Если в структуре есть name инпута и он уникален, можно его использовать
Anastasya
Все лучше индекса массива))
🦜
Тян норм вещь толкает про name