https://youtu.be/Ug_dwJa07Os

Неожиданно, Тактаров ?

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

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

Ребят, такой вопрос, делаю на реакте комментарии, которые можно в форме добавить и они ниже отобразятся, так же хочу реализовать кнопки редактировать, удалить, само приложение на реакт+редакс, Как правильно это реализовать? В мой компонент который рендерит комментарий приходят пропсы: мой {..} и Id

Ребят, такой вопрос, делаю на реакте комментарии, которые можно в форме добавить и они ниже отобразятся, так же хочу реализовать кнопки редактировать, удалить, само приложение на реакт+редакс, Как правильно это реализовать? В мой компонент который рендерит комментарий приходят пропсы: мой {..} и Id

вопрос конкретизируйте, что именно не понятно?

вопрос конкретизируйте, что именно не понятно?

Как это сделать и отправить в редакс и данные сохранились уже в новом виде

Ребят, такой вопрос, делаю на реакте комментарии, которые можно в форме добавить и они ниже отобразятся, так же хочу реализовать кнопки редактировать, удалить, само приложение на реакт+редакс, Как правильно это реализовать? В мой компонент который рендерит комментарий приходят пропсы: мой {..} и Id

комменты приехали из пропсов, для удаления/редактирования - экшены для добавления - экшен после добавления/удаления/редактирования - обновляется лист комментариев

Как это сделать и отправить в редакс и данные сохранились уже в новом виде

с помощью экшенов и редьюсера) ну правда, вопрос не о чем пока что… еще конкретики. Бэкэнд есть или нет или как?

с помощью экшенов и редьюсера) ну правда, вопрос не о чем пока что… еще конкретики. Бэкэнд есть или нет или как?

Без бэкенда

Главное, чтоб api было готово

Без бэкенда

это уже интересно..)

принцип такой же будет, храните данные в массиве, изменяете по индексу, удаляете по индексу, добавляете - просто в конец массива

Я просто думал, что нужно что бы из пропсов приходил в мой компонент весь мой массив, и при изменении и сохранении, вызывался метод который принимал весь массив, мой ид,новые данные внутри я бы делал проверку на ид, и возвращал новый массив

Который уже дальше бы диспатчил в редакс

Плохая идея?

не, вы диспатчите экшен, а в редьюсере возвращаете новый массив

то есть работа с комментариями, это классическая работа с туду листом (1 в 1)

принцип такой же будет, храните данные в массиве, изменяете по индексу, удаляете по индексу, добавляете - просто в конец массива

Добавить в конец массива - не проблема, а вот изменить текущий, это почему то проблема, сами изменения в редюсере нужно сделать или перед отправкой?

Редакс ведь возвращает всегда новый объект, а не мутируется

Поэтому возникли проблемы из-за не знания как это делается

Добавить в конец массива - не проблема, а вот изменить текущий, это почему то проблема, сами изменения в редюсере нужно сделать или перед отправкой?

улетает экшен типа { type: EDIT_COMMENT, payload: {index: 123123, text: ‘new text’} } в редьюсере ловится этот экшен и по индексу находится элемент, заменяется, возвращается новый массив

Редакс ведь возвращает всегда новый объект, а не мутируется

> всегда новый объект, а не мутируется вот всегда массив бывший и клонируется как будто бы, в нем только по индексу меняется элемент и возвращается а-ля новый массив

> всегда новый объект, а не мутируется вот всегда массив бывший и клонируется как будто бы, в нем только по индексу меняется элемент и возвращается а-ля новый массив

То есть нажатию «сохранить», у меня в редакс улетает мои новые данные + индекс? Который в свою очередь в компоненте из пропсов?

Правильно хоть мыслю?

да

absolutely :)

В редюсере фильтром перебираю и возвращаю новый массив ?

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

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

Спасибо за помощь

можно и объект сделать, где ключом является id коммента, а внутри - все про коммент и затем просто наследовать весь объект и заменять одно свойство. тут дело хозяина)

у Дэна на egghead есть про это в принципе, и в первом и во втором туториале про редакс

Всем привет, ребят, кто-нибудь работал с react-select? Есть проблема - когда я выбрал какое-то значение из выпадающего списка и хочу, например, удалить последние 2 буквы из выбранного значения(например есть какое-нибудь значение с похожим названием), но получается так, что я удаляю слово целиком и это очень огорчает( Может кто-нибудь сталкивался с подобным и может подсказать?)

у Дэна на egghead есть про это в принципе, и в первом и во втором туториале про редакс

Сейчас поищу

а как проверяете типы в реакте? онли prop-types?

а как проверяете типы в реакте? онли prop-types?

Тс флов еще есть

тайпскрипт?

тайпскрипт?

Да

Но основная проблема Flow, что типы, которые вы пишите, напоминают предвыборную программу депутатов Верховной Рады Украины. То есть вы предполагаете, что некоторые типы будут туда приходить, а на самом деле туда приходит не совсем то, что вы ожидаете. К примеру, вы ожидаете, что в компонент всегда будет приходить пользователь, а иногда туда приходит null — всё, вы не поставили знак вопроса, Flow это никак не отловит. То есть полезность Flow начинает падать, как только вы начинаете его накручивать на существующий проект, где у вас в голове вроде как есть понимание, что происходит, но на самом деле это не всегда происходит так, как вы задумали.

Резюмирую, в голове вроде как есть понимание, что происходит, но на самом деле это не всегда происходит так

Резюмирую, в голове вроде как есть понимание, что происходит, но на самом деле это не всегда происходит так

в точку))

Резюмирую, в голове вроде как есть понимание, что происходит, но на самом деле это не всегда происходит так

Именно

Неожиданно, Тактаров ?

?

Резюмирую, в голове вроде как есть понимание, что происходит, но на самом деле это не всегда происходит так

Понимание, но не осознание

?

Знаю этого чувака, не думал, что он в анимациях хорошо шарит.

а если мне надо передать в онклик метод параметр, я типа такого могу сделать? <button onClick={this.clicked_getChannelDataURL(this.props.match.params.id) }/>

а если мне надо передать в онклик метод параметр, я типа такого могу сделать? <button onClick={this.clicked_getChannelDataURL(this.props.match.params.id) }/>

() =>

() =>

я счастлив, все работает - спасибо

я счастлив, все работает - спасибо

?

Ребят, посоветуйте либу которая из московской datetime сделает что-то типа "5 минут назад" и еще учтет часовой пояс пользователя

для комментов

Ребят, посоветуйте либу которая из московской datetime сделает что-то типа "5 минут назад" и еще учтет часовой пояс пользователя

Pharaon

Pharaon

что-то не найду

что-то не найду

Хз момент чекни

Pharaon

ты про песню ??

ты про песню ??

Ага

момент такое себе

момент такое себе

date-fns?

Или как он там

там на русском?

ребята помогите пожалуйста как сделать так, что бы не менять состояние, а склонировать его? handleRemoveProduct = (id) => { let {entries} = this.state.cart; let index = entries.findIndex((x => x.id === id)); entries.splice(index, 1); this.setState({ cart: {entries} }); };

ребята помогите пожалуйста как сделать так, что бы не менять состояние, а склонировать его? handleRemoveProduct = (id) => { let {entries} = this.state.cart; let index = entries.findIndex((x => x.id === id)); entries.splice(index, 1); this.setState({ cart: {entries} }); };

Слайс

Сплайс мутирует

а тут? handleAddToCart = (product) => { let {entries} = this.state.cart; if(this.checkProduct(product.id)){ let index = entries.findIndex((x => x.id === product.id)); entries[index].quantity = entries[index].quantity + product.quantity; } else { entries.push(product); } this.setState({ cart: { entries }, quantity: 1 }); };

ERROR: S client not available

а тут? handleAddToCart = (product) => { let {entries} = this.state.cart; if(this.checkProduct(product.id)){ let index = entries.findIndex((x => x.id === product.id)); entries[index].quantity = entries[index].quantity + product.quantity; } else { entries.push(product); } this.setState({ cart: { entries }, quantity: 1 }); };

Юзац превстейт

Коллбек в сетстейт

а тут? handleAddToCart = (product) => { let {entries} = this.state.cart; if(this.checkProduct(product.id)){ let index = entries.findIndex((x => x.id === product.id)); entries[index].quantity = entries[index].quantity + product.quantity; } else { entries.push(product); } this.setState({ cart: { entries }, quantity: 1 }); };

Пуш мутирует

Пуш мутирует

спасибо большое

спасибо большое

https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns вот тут полно решений

https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns вот тут полно решений

спасибо огромное, а то я только учусь, очень сложно пока врубиться

спасибо большое

entries[index].quantity = entries[index].quantity + product.quantity; здесь тоже

entries[index].quantity = entries[index].quantity + product.quantity; здесь тоже

да, я понимаю из-за чего происходит мутация, я не знаю как правильно написать. спасибо за ссылки, сижу читаю, вникаю

СетСтейт принимает еще аргументом колцбек, это базовые знания, лучше доку перечитай, там на первых страницах

уже начал читать про cloneDeep у lodash

но, что-то так и не смог ничего сделать

Какая у тебя задача вообще?

ребят, а как правильно добавить id при добавлении нового обьекта в массив?

ребята помогите пожалуйста как сделать так, что бы не менять состояние, а склонировать его? handleRemoveProduct = (id) => { let {entries} = this.state.cart; let index = entries.findIndex((x => x.id === id)); entries.splice(index, 1); this.setState({ cart: {entries} }); };

Фильтром удаляй продукт

не правильно написал) диспатчю новый обьект в массив, Текст + автор

хочу и id каждому добалять, который будет ++ каждый раз

Какая у тебя задача вообще?

добавление товара в корзину и удаление, со всеми вытекающими подсчетами колличества и цены

({ items: prevState.items.filter((item) => item.id !== id) })

({ items: [...prevState.items, newItem] })

Какая у тебя задача вообще?

https://gist.github.com/sanyco86/9df22a3c6bce7d24432a5def8fd373d8

ребята помогите пожалуйста как сделать так, что бы не менять состояние, а склонировать его? handleRemoveProduct = (id) => { let {entries} = this.state.cart; let index = entries.findIndex((x => x.id === id)); entries.splice(index, 1); this.setState({ cart: {entries} }); };

Если нужно получить глубокую копию, то lodash.cloneDeep или что-то похожее

А, уже написали про это, извиняюсь

А, уже написали про это, извиняюсь

да, это я писал, что пробовал, но у меня что-то не получилось

копия получалась, но она почему то в setState не писалась((

да, это я писал, что пробовал, но у меня что-то не получилось

Посмотри мои примеры

like - height:100% dislike - height:100vh; Любопытство немного мучает :)

если что, 100vh херово работает на мобилках

когда строка браузера сдвигается/выдвигается

({ items: prevState.items.filter((item) => item.id !== id) })

а prevState это из какой-то либы или это переменная какая-то?

а prevState это из какой-то либы или это переменная какая-то?

this.setState((prevState) => ...

Сетстейт коллбек принимает, уже третий раз

this.setState(prevState => ({ cart: { entries: prevState.cart.entries.filter((item) => item.id !== id) } }));