Контенкст юзал, document.getElementById не будет работать с функциональыми компонентам

потому что нода c id в виртуальном dom, а document.getElementById обращается к уже существующему dom, не виртуальному

Если ты пишешь формы на реакте - это не значит что ты програмируешь

не пиши формы на реакте 🤷‍♂️

Я предлагаю тебе проверить самому

Вот мой пример: https://jsfiddle.net/ykqzporn/ 🙂

https://jsfiddle.net/spatnehochu/9w3d2ts5/7/

Вот мой пример: https://jsfiddle.net/ykqzporn/ 🙂

Ну не удивительно, в момент запроса к дому его и не существует, собственно и ref.current так же будет null в этот момент.

Да, и я это описал выше, у тебя все работает потому что все рендерится в одном родительском компоненте, потому что у тебя пример сферичский в кубе 🙂 В продакшене компонент Линки может быть заимпорчен в любую пейджу или другой компонент, и нет гарантии что ноды с id и линк к ней окажутся в одном родителе

делал сайт на 100+ компонентов с одной формой - вход, ЧЯДНТ?

Нет, ты не прав, мой пример будет работать хоть в каком угодно случае, потому что он оперирует нативным поведение браузера, а резолс происходит во время события, в данном случая это будет работать даже если у тебя будет два instance react. https://jsfiddle.net/spatnehochu/9w3d2ts5/16/

У тебя 2 инстанса, но все что внутри все равно под одним родителем, вот сделал по клику: https://jsfiddle.net/5egnkz1m/2/

о, preact сайтец обновили. Симпотично выглядит и доку на 10, они даже сделали свой preact-create-app

А мне кажеться уже что это ты меня тролишь, причем тут родитель?

о, preact сайтец обновили. Симпотично выглядит и доку на 10, они даже сделали свой preact-create-app

а что поменялось то?

Чувствую надо сделать пример на gatsby, все равно пасиб!

этому дизайну уже лет 200 наверное)часто на сайт заходишь?

этому дизайну уже лет 200 наверное)часто на сайт заходишь?

я тут из доки преакта узнал, что у реакта нет onInput, сижу на реакте 9 месяцев, только сейчас узнал этот факт. Как я не замечал этого, вообще не понятно... Я часто сразу прибегал к formik и rff, но юзал так же импуты от семантика, и думал, что там убрали эвент onInput "просто потому, что" и смирился с этим фактом, лол.

я тут из доки преакта узнал, что у реакта нет onInput, сижу на реакте 9 месяцев, только сейчас узнал этот факт. Как я не замечал этого, вообще не понятно... Я часто сразу прибегал к formik и rff, но юзал так же импуты от семантика, и думал, что там убрали эвент onInput "просто потому, что" и смирился с этим фактом, лол.

И в чем разница с onChange?

я смотрю автор preact идет скорей по пути vue/angular, чем реакта. У них расширяемый preact-cli (как vue-cli), свой роутер, свой стор и прочее.

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

Завязывание на себя не обязывает использовать роутер преакта, не обязывает использовать стор преакта.

я тут из доки преакта узнал, что у реакта нет onInput, сижу на реакте 9 месяцев, только сейчас узнал этот факт. Как я не замечал этого, вообще не понятно... Я часто сразу прибегал к formik и rff, но юзал так же импуты от семантика, и думал, что там убрали эвент onInput "просто потому, что" и смирился с этим фактом, лол.

Гайз я тут завис на мысли... Если мы делим компоненты на контейнеры и презентационные.. Сейчас я использую Storybook активно в проекте, и хочу его оставлять максимально независымым от store. Получается что некоторые компоненты деляться на презентационный, и контейнер для него же, только который уже знает о существовании сторы, сервисов и тд... Вопрос заключается в том, что делать со "сквозными пропсами"? Пропсы типа колбеков onTItleClick, onPlatformChange, а так же пропсы из серии initialTab, defaultButtonText и подобные. Вроде как напрашивается мысль что абсолютно нормально их прокидывать "сквозняком" Но наличие тайпскрипта в проекте заставляет задумываться об этом каждый раз, когда прописываю один и тот же пропс для презентационного и для контейнера (да, я понимаю что можно создать общий тип/интерфейс и использовать его в обоих случаях. Но все же вопрос на сколько это нормально? Или может я что-то делаю вообще не так??

Это пока не все 99% проектов будет писать на экосистеме, а потом все остальное отмирает, а потом под тяжестью монолита подыхает вся экосистема.

Это пока не все 99% проектов будет писать на экосистеме, а потом все остальное отмирает, а потом под тяжестью монолита подыхает вся экосистема.

А потом ты просыпаешься и видишь в ужасе, что куча экосистем как на фронте, так и на беке живёт так как я описал.

Гайз я тут завис на мысли... Если мы делим компоненты на контейнеры и презентационные.. Сейчас я использую Storybook активно в проекте, и хочу его оставлять максимально независымым от store. Получается что некоторые компоненты деляться на презентационный, и контейнер для него же, только который уже знает о существовании сторы, сервисов и тд... Вопрос заключается в том, что делать со "сквозными пропсами"? Пропсы типа колбеков onTItleClick, onPlatformChange, а так же пропсы из серии initialTab, defaultButtonText и подобные. Вроде как напрашивается мысль что абсолютно нормально их прокидывать "сквозняком" Но наличие тайпскрипта в проекте заставляет задумываться об этом каждый раз, когда прописываю один и тот же пропс для презентационного и для контейнера (да, я понимаю что можно создать общий тип/интерфейс и использовать его в обоих случаях. Но все же вопрос на сколько это нормально? Или может я что-то делаю вообще не так??

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

Ну КАК написать - дело десятое. Основной поинт вопроса был в том "на сколько это адекватный подход"?

как обращаться к пропсам компонента внутри функции промис? (закидайте тапками)

Добрый день. Подскажите как обойти эту проблему? from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Тебе нужно на бэке дать разрешение связаться с фронтом. Если у тебя нода, то есть пакет cors

спс

Как к беку обращаешься?

Ребята, пробую собрать реакт-приложение: npm run build Но на выходе в build/index.html пустая страница есть мысли, что делаю не так? (буду благодарен за ответ)

Добрый день. Подскажите как обойти эту проблему? from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Открыл для себя rxjs, наблюдатели и реактивное программирование. Этот паттерн часто используют с реактом?

Подскажите, как поправить. Из data.json беру инфу. Там 2 поля city и population. Короче надо вывести в селекте все города, где population больше 50000.

Открыл для себя rxjs, наблюдатели и реактивное программирование. Этот паттерн часто используют с реактом?

код текстом выложи

Подскажите, как поправить. Из data.json беру инфу. Там 2 поля city и population. Короче надо вывести в селекте все города, где population больше 50000.

function CityRend() { return (data.filter(function(item) { if (item.population > 50000) { return ( <option> {item.city} </option> ); } return false; } )) }

Подскажите, как поправить. Из data.json беру инфу. Там 2 поля city и population. Короче надо вывести в селекте все города, где population больше 50000.

тело function CityRend замени на return data.filter(({ population }) => population > 50000) .map(({ city }) => ( <option> {city} </option> ));

тело function CityRend замени на return data.filter(({ population }) => population > 50000) .map(({ city }) => ( <option> {city} </option> ));

тело function CityRend замени на return data.filter(({ population }) => population > 50000) .map(({ city }) => ( <option> {city} </option> ));

Ну reduce же

зачем 2 раза перебирать массив?

Чтобы отделить фильтрацию и формирование jsx

ok, но хватит и 1 раза.

ok, но хватит и 1 раза.