.json - а в файле там у него как-будто js. Не смущает?)

А, вижу, да

Поставь нормальный редактор который подскажет что у тебя жсон файл невалидный

какой например?

Вскод

спасибо

Колбеком от родителя - в колбэк стейт? не будет инфинитилуп?

ща бы в жсон писать const data

и кто какой сервер юзает для джейсона с самой простой имплементацией?

и кто какой сервер юзает для джейсона с самой простой имплементацией?

Самый простой - кидаешь в папку где лежат статические файлы

и импортишь как js файл, предсказуемо

Нет, fetch

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

Хм, узнал к примеру про Ctrl+B в PhpStorm'е, это разве не изучение IDE? Ладно ладно, уже ухожу, сорь =)

Нет, fetch

сам себе в статпапке) удивительно

какие лучше плагины для анимации юзать? react-spring/velocity/other?

может локальный сервер поднять (попроще и туториал не как у Эппкеша)

может локальный сервер поднять (попроще и туториал не как у Эппкеша)

Напиши простой рест апи на ноде.

знать бы хорошо ноуд))

На гх куча примеров с простым рест апи на ноде. Погугли.

с туториалом на 23 страницы)) счас погуглю

Кто нибудь юзает create-reatc-app? Как там дев сервер на локалхосте настроить, чтоб можно было к нему обращаться?

Никак, он только для реакта

как мне етперь присвоить то что внутри файла в репеменную? import './data.json';

Выше прочитай, писали

слушайте, есть метод в родительском компоненте, логика: сравнивает кликнутый элемент с элементов в стейте(хочу этот массив на сервер вынести) и потом сравнивает со коллекцией маркеров (она должна придти из дочернего элемента) showInfowindow = (event, markers)=> { console.log('yoyoy') console.log(event.currentTarget) console.log(this.state.Places) //this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/ //const marker = this.state.markers.find(el => el.id === element); //new window.google.maps.event.trigger(marker, 'click'); }

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

вот дочерний render(){ //console.log(this.props.openInfoWindow) //console.log(this.state.markers) return( <div ref={this.myMapContainer} id="map" onClick={this.props.openInfoWindow(this.state.markers)} getMarkers={this.getMarkers.bind(this)} /> ) }

если все время менять стейт с маркерами у родителя - получается инфинити луп

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

слушайте, есть метод в родительском компоненте, логика: сравнивает кликнутый элемент с элементов в стейте(хочу этот массив на сервер вынести) и потом сравнивает со коллекцией маркеров (она должна придти из дочернего элемента) showInfowindow = (event, markers)=> { console.log('yoyoy') console.log(event.currentTarget) console.log(this.state.Places) //this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/ //const marker = this.state.markers.find(el => el.id === element); //new window.google.maps.event.trigger(marker, 'click'); }

нужен работающий кусок кода на http://codesandbox.io/, а так...

может гист подойдет?

нижний компонент - https://gist.github.com/Natanagar/67929a10eaf47edf4d9908b52eb2fdaa

может гист подойдет?

ну пиши как хочешь, но те же консоли твои гист покажет?

а какая песочница показывает?

а какая песочница показывает?

codepen codesandbox

Fiddle?

Просто вставить Link?

пробовал

Кто нибудь юзает create-reatc-app? Как там дев сервер на локалхосте настроить, чтоб можно было к нему обращаться?

в package.json добавляете proxy "proxy": { "/api/*": { "target": "http://localhost:3002" } },

не работет так

мне надо по нажатию на этот див передать id перейти на компонент

не работет так

Сделай пример на codesandbox и прочитай первое правило чата

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

начнем с малого: как вы передаете это стейт?

Fiddle?

у вас там зависимостей дофига, думаю вам никакая песочница не поможет

да, там депенсенсис много(

Массив с маркерами в компоненте карта render(){ //console.log(this.props.openInfoWindow) //console.log(this.state.markers) return( <div ref={this.myMapContainer} id="map" onClick={this.props.openInfoWindow(this.state.markers)} getMarkers={this.getMarkers.bind(this)} /> ) }

это this.state.markers^^'

я его вкладываю как аргумент функции openInfoWindow

у родительского компонента есть метод showInfowindow = (event, markers)=> { console.log('yoyoy') console.log(event.currentTarget) console.log(this.state.Places) //this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/ //const marker = this.state.markers.find(el => el.id === element); //new window.google.maps.event.trigger(marker, 'click'); }

это this.state.markers^^'

на сообщения отвечать надо, а не просто писать

у родительского компонента есть метод showInfowindow = (event, markers)=> { console.log('yoyoy') console.log(event.currentTarget) console.log(this.state.Places) //this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/ //const marker = this.state.markers.find(el => el.id === element); //new window.google.maps.event.trigger(marker, 'click'); }

marker это никакой не стейт у вас

у меня не нативный телеграмм, а франц, там особо не работает опция ответить

у меня не нативный телеграмм, а франц, там особо не работает опция ответить

у вас в стейте вот это state ={ Places : [] } как вы рассчитываете что у вас this.state.markers там как-то окажется?

//this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/

у меня не нативный телеграмм, а франц, там особо не работает опция ответить

тут вы загоняете некий абстрактный стейт в константу marker? а потом типо вызываете гугл карты, так? //const marker = this.state.markers.find(el => el.id === element); //new window.google.maps.event.trigger(marker, 'click');

//this.setState({ // markers: this.state.markers //}); /*() => console.log(this.state.markers)*/

он не прописан в конструкторе это раз

нет, я вызываю метод у родительского элемента и туда аргументом передаю onClick={this.props.openInfoWindow(this.state.markers)

нет, я вызываю метод у родительского элемента и туда аргументом передаю onClick={this.props.openInfoWindow(this.state.markers)

как ваш компонент может пеердать стейт которым он не владеет

нет, я вызываю метод у родительского элемента и туда аргументом передаю onClick={this.props.openInfoWindow(this.state.markers)

если стейт вверху его надо передавать как-то по-другому

https://codesandbox.io/embed/nr665xro2l вот код я имел ввиду мне надо передать id в компонет и перети на этот компонетнт

нет идет не сверху (сверху стейт-пропс) он идет от ребенка к родителю

нет идет не сверху (сверху стейт-пропс) он идет от ребенка к родителю

ваш this.state.markers никак не принадлежит этому компоненту от которого выпередаете, я думаю поэтому он и не может его передать. это делается не так. стейт так не поднимают

ERROR: S client not available

нет идет не сверху (сверху стейт-пропс) он идет от ребенка к родителю

он смотрит на свой стейт и не видит там никаких markers? какая ему разница что там у родителя

https://codesandbox.io/embed/nr665xro2l вот код я имел ввиду мне надо передать id в компонет и перети на этот компонетнт

У вас не рабоатет

нет идет не сверху (сверху стейт-пропс) он идет от ребенка к родителю

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

но почему никак? если сами маркеры создаются в этом компоненте, пушатся в массив в этом компоненте, добавляются в стейт в этом(идет речь о дочке)? ну хорошо, может я нуб и не понимаю

вообще стейт хранится в одн месте по хорошему, если нет, то пеердается наверх черз функции а вниз через пропсы => good point!

https://codesandbox.io/embed/nr665xro2l вот код я имел ввиду мне надо передать id в компонет и перети на этот компонетнт

https://reacttraining.com/react-router/web/example/url-params

но почему никак? если сами маркеры создаются в этом компоненте, пушатся в массив в этом компоненте, добавляются в стейт в этом(идет речь о дочке)? ну хорошо, может я нуб и не понимаю

ну вот ваш стейт в этом компоненте state ={ Places : [] }

но почему никак? если сами маркеры создаются в этом компоненте, пушатся в массив в этом компоненте, добавляются в стейт в этом(идет речь о дочке)? ну хорошо, может я нуб и не понимаю

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

но почему никак? если сами маркеры создаются в этом компоненте, пушатся в массив в этом компоненте, добавляются в стейт в этом(идет речь о дочке)? ну хорошо, может я нуб и не понимаю

как child может редактировать стейт родителя, если по любой логике это невозможно

но почему никак? если сами маркеры создаются в этом компоненте, пушатся в массив в этом компоненте, добавляются в стейт в этом(идет речь о дочке)? ну хорошо, может я нуб и не понимаю

где ваш компонент с markers? я его не вижу

https://gist.github.com/Natanagar/f0f08fe300a849aefe170d837a4d9bfb

https://gist.github.com/Natanagar/f0f08fe300a849aefe170d837a4d9bfb

ну по любым правилам JS вы же не можете в какой-то функции редактировать какую-то левую переменную из другой функции, так?

если это не closures и переменная не обьявлена глобально

Подскажите, как на статичном сайте хранить, например, содержимое статей. И как эти данные передавать компоненту статьи.

хорошо, как передать стейт в моей ситуации (вообще как его передавать в принципе)

если это не closures и переменная не обьявлена глобально

в ES думаю так не делают

Подскажите, как на статичном сайте хранить, например, содержимое статей. И как эти данные передавать компоненту статьи.

Gatsby или next.js смотри

хорошо, как передать стейт в моей ситуации (вообще как его передавать в принципе)

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

хорошо, как передать стейт в моей ситуации (вообще как его передавать в принципе)

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

ну как зачем? метод должен получить эти маркеры (мать их так) и сравнить по айди с таргетируемым элементом

щас щапилю

ну как зачем? метод должен получить эти маркеры (мать их так) и сравнить по айди с таргетируемым элементом

простой пример, стейт формально в инпутах https://codesandbox.io/s/5zkq5yvxyp

ну как зачем? метод должен получить эти маркеры (мать их так) и сравнить по айди с таргетируемым элементом

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

ну как зачем? метод должен получить эти маркеры (мать их так) и сравнить по айди с таргетируемым элементом

через пропсы спускаете вниз функцию, которая забирает все это наверх

пример в туториалах реакта в том числе, но там сложнее, потому что стейт гуялет вверх-вниз какбе, хотя и не настолько сложно https://reactjs.org/tutorial/tutorial.html#lifting-state-up

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

привет Дэну, думай как Реакт)

наверное для таких идиотов как я и придумали flux

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

флакс я так понимаю для других целей немного

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

ну родитель типо контролирует детей, это норма для реакта. что-то забрать я думаю только через функцию

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

или обработчик события точнее