addPostButton(){ console.log('Button was clicked'); console.log(this.refs.author.value); const postData ={name:this.refs.author.value, article:this.refs.article.value}; console.log (postData); this.refs.author.value = ''; this.refs.article.value = ''; const {dispatch} = this.props; dispatch(AddPostAction(postData)); }

зачем ты с DOM работаешь?

Всмысле зачем с DOM работаю?

MadMax https://github.com/kre1z0/appetito

и на success'ы в итоге куда?)

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

редьюсеры нам

function successPosts(payload){ return{ type:"GET_POSTS", payload } }

onst initState = { isFetching: false, payload: {}, errorMessage: '' } export default function posts(state = initState, action) { switch (action.type) { case "GET_POSTS": case "FETCH_PRODUCT_SUCCESS": case "FETCH_PRODUCT_ERROR": console.log('reducer', action.payload) return getPosts(state, action); default: return state; } } function getPosts(state = initState, action) { switch (action.type) { case 'GET_POSTS': console.log('reducer', action.payload) return Object.assign({}, state, { payload: action.payload, isFetching: false, errorMessage: '' }); case 'GET_POSTS_ERROR': console.log('reducer', action.payload) return Object.assign({}, state, { errorMessage: action.errorMessage }); default: return state; } }

redux logger установи

таакс, ну и в posts ты конечно же делаешь mapStateToProps?)

нет....

Да

делаю mapStateToProps)

Мнет страшно!

смешно)

в общем да, поставь логгер и смотри как резолвится экшен, как обновляется стор и на что смотрит posts

я бы предложил отдельно накодить более простой пример использования redux и react, чем форма ввода

ребята, а нормально инициализировать начальный стейт для компонента на основпе пропсов ? что то типа constructor() { super(); this.state = { currentPage: (!this.props.devices.length ? 0 : 1) title: '', icon: '' }; };

реально, странные вопросы и странная работа с DOM через refs

если твой дебаг консоль логами говорит тебе, что экш проходит и в стор пишется, то проблема скорей всего с подпиской на стор компонента постов

ребята, а нормально инициализировать начальный стейт для компонента на основпе пропсов ? что то типа constructor() { super(); this.state = { currentPage: (!this.props.devices.length ? 0 : 1) title: '', icon: '' }; };

https://medium.com/@justintulk/react-anti-patterns-props-in-initial-state-28687846cc2e#.mo4zamhhu

ребята, а нормально инициализировать начальный стейт для компонента на основпе пропсов ? что то типа constructor() { super(); this.state = { currentPage: (!this.props.devices.length ? 0 : 1) title: '', icon: '' }; };

в отдельных случаях можно и так, но тогда надо будет добавить ещё и метод componentWillReceiveProps https://facebook.github.io/react/docs/react-component.html#componentwillreceiveprops, потому что может произойти ситуация, когда твой компонент инициализируется без параметров а вообще не стоит пихать данные, зависимые чисто от пропсов в стейт

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

можешь писать defaultProps и перекидывать значения в стейт

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

It's okay to initialize state based on props if you know what you're doing. будем пробовать

АЙ РЕБЯТКИИИИИ!!! Спасибо!))

ADD POST вообще ни как не реагировал в логах

А сейчас прям замечательненько!

Вчера начал копать React по немного, даже Hello World и SASS запустить смог! А это норма сразу брать для компонентов какой-нибудь design-ant? Посмотрел его и прям кайфую от компонентов.

Вчера начал копать React по немного, даже Hello World и SASS запустить смог! А это норма сразу брать для компонентов какой-нибудь design-ant? Посмотрел его и прям кайфую от компонентов.

Да. Бери. Очень тебе поможет потом.

Если цель разобраться в реакте, то лучше имхо самому все сначала делать

Плюсую

вообще нет смысла

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

Как выстраивать композиции компонентов самому, например

ant не покрывает все кейсы в любом случае

Как выстраивать композиции компонентов самому, например

что ты имеешь в виду лол?

В чем смысл понимать потом как все работает, если ты это делаешь ради того, чтобы понять как все работает)

В чем смысл понимать потом как все работает, если ты это делаешь ради того, чтобы понять как все работает)

ant не покрывает все кейсы, он будет учиться на других

а готовые компоненты просто будут экономить время

Был когда-нибудь на уроках геометрии, где есть аксиомы, но учеников просят все равно доказать их сначала? :) Хотя можно было и сэкономить время

ничего что design-ant официально не поддерживает material design, а значит и каких-то, но стандартов оформления?

Был когда-нибудь на уроках геометрии, где есть аксиомы, но учеников просят все равно доказать их сначала? :) Хотя можно было и сэкономить время

вот бы щас геометрию к построению веб-приложений за уши притянуть

ну я тебе могу притянуть инкапсуляцию

А я не про веб-приложения, а про процесс обучения

я учил одного человека яваскрипту и сразу давал ему antd и все было норм

на моей стороне практика, на твоей предположения

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

ребята, ковыряю next.js - почему-то из коробки styled-jsx все классы глобальными делает, почему такое может быть, там конфигов даже нет...?

css-in-js какой самый популярный? кроме styled-components

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

то есть ему норм брать antd?

а то в styled-jsx нет даже nested объявлений, как я понял самое навороченное будет postjss если когда-нибудь до стабильной дойдет...

Мне написать еще раз свой ответ на этот вопрос?) Если цель разобраться в реакте, то лучше имхо самому все сначала делать

особенно формы с валидацией, модалки и пагинацию :D

Был когда-нибудь на уроках геометрии, где есть аксиомы, но учеников просят все равно доказать их сначала? :) Хотя можно было и сэкономить время

Аксиомы не доказывают, доказывают теоремы

Он про то и говорит

Что смысл доказывать уже доказанное?

что ты имеешь в виду лол?

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

Это да, особенно понять жизненые циклы компонента)

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

дак он будет и так писать компоненты

Я придерживаюсь подхода от простого к сложному

Кнопка — просто, готовый компоненты формы — нет

ERROR: S client not available

css-in-js какой самый популярный? кроме styled-components

http://cssinjs.org

Что делать если в листенере от компонента не передается event? очень нужен

event от dom элемента ?

компонент сам слушает свои эвенты и почему-то их не регистрирует? Эти эвенты вообще триггерятся?

Есть материал дизайн компонент autocomplete, и в его event onUpdateInput не передается event, от которого можно брать target

я тоже так хочу иногда делать когда сижу с телефона

e.presist() в хэндлере? или вообще нет его?

а если написать onUpdateInput={function(event, value) { .... ?

В хэндлере только value и source списка

а если написать onUpdateInput={function(event, value) { .... ?

Тогда в event будет строка)

а с чего он там должен быть, мб в апи нет его

Верно. А нужен

тогда другое событие нужно. Родное, с event

этот onUpdateInput какая-то обетка

*обертка

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

Причём в компоненте textfield именно так

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

+1, попробуй навеситься на onChange или onInput

Onchage не срабатывает, oninput тайпинги банят

Посмотри исходник этого AutoComplete , там не должно быть больше экрана кода

Если не прокидывает переданные ему в пропсах onChange/onInput на свой textfield, то придется навеситься на dom-элемент самому, но что это за компонент такой получается.

Сам не восторге от такого компонента

Если пытаешься добиться какого-то нестандартного поведения, отнаследуй его класс и доработай под свои нужды... Подозреваю, не единственная поле с автокомплитом..

Доработать чтобы в onUpdateInput не глотал event. Назвать как AutoCompleteClosable или что там от него требуется. Заменить на него в форме. И тд

Профи наверное скажут что тогда придется ему еще и тесты на измененный или добавленный функционал написать. Чтобы не развалилось при обновлении библиотеки с самим <AutoComplete>

Лучше сразу localized строки. Ибо потом боль

https://github.com/lelandrichardson/redux-pack

видел / использовал кто?

Интересные рассуждения

кратко — "redux-thunk is too powerful" (https://twitter.com/intelligibabble/status/800103510624727040)