так у него же типа "совместимость", должно итак всё работать :)

Вот что это за ? require.ensure(['./maps'], function (require) { TypeError: require.ensure is not a function

Привет чат Как сделать правильно с т зрения архитектуры. Есть список фильтров, пользователь может их редактировать, при запуске они подгружаются из storage. Но есть системные фильтры, их нельзя изменять / удалять. Как их хранить? При первом запуске их просто добавить в список, и потом надеятся что не пропадут?

Привет чат Как сделать правильно с т зрения архитектуры. Есть список фильтров, пользователь может их редактировать, при запуске они подгружаются из storage. Но есть системные фильтры, их нельзя изменять / удалять. Как их хранить? При первом запуске их просто добавить в список, и потом надеятся что не пропадут?

1. Какую технологию для хранения состояния приложения вы используете? 2. Что значит надеяться? У вас есть какие-то методы для пользователя, которые позволяют удалять системные фильтры?

3. Каков формат данных фильтров?

1 redux, с сохранением в localStorage. 2 Ну нельзя исключать что их там не будет. 3 массив объектов

const systemFilterList = [ doc => doc.type != 1, doc => doc.type != 2, doc => doc.name != 'bla', ] const selectFiltered = (state, customFilterList) => { const filterList = [ ...customFilterList, ...systemFilterList ] // USE IT }

хм, неплохо, спасибо)

однако я не знаю где мне брать customFilterList, у меня есть только стейт со всеми фильтрами

customFilterList - это пользовательские фильтры

Вы их передаете в mapStateToProps

Где и происходит фильтрация

Где и происходит фильтрация

пойду читать про mapStateToProps

пойду читать про mapStateToProps

Это первый параметр, который принимает connect из react-redux и позволяет сделать map части дерева state на props компонента.

Это первый параметр, который принимает connect из react-redux и позволяет сделать map части дерева state на props компонента.

ок, так понятней, спасибо

Вторым параметром является mapDispatchToProps, которые позволяет сделать map actionCreator-ов на props.

Так же есть упрощенная форма записи второго параметра в виде объекта, ключами которого являются названия props, а значениями нужные вам actionCreator, которые автоматически оборачиваются в dispatch.

И вам остается только вызвать их внутри комопнента, например если у вас есть actionCreator "doSomething" и вы вызваете его в классическом виде store.dispatch(doSomething()), то при connect(null, { doSomething })(YourComponent) вы можете вызывать его this.props.doSomething().

Это первый параметр, который принимает connect из react-redux и позволяет сделать map части дерева state на props компонента.

а если у меня несколько компонентов, которым нужен filterList, но им нужны и другие пропсы

каждому свои

Все зависит от того, где вы храните customFilterList в приложении. Если он приходит из какого-то верхнеуровнего компонента, передайте его оттуда.

connect дополняет props компонента, а не заменяет их

connect дополняет props компонента, а не заменяет их

а я коненчку разные пропсы connect(state => ({filterList: state.filterList, something1: state.something1})) connect(state => ({filterList: state.filterList, something2: state.something2}))

customFilterList хранится в редаксе

connect один в компоненте

connect один в компоненте

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

Это HOC, который добавляет в props переданные actions и данные из стор(oв)

customFilterList хранится в редаксе

а something1,2 откуда?

из state

и что не так тогда?)

а я коненчку разные пропсы connect(state => ({filterList: state.filterList, something1: state.something1})) connect(state => ({filterList: state.filterList, something2: state.something2}))

Конектите - хорошо. В чем вопрос тогда?

И если вы храните customFilterList в state - то вам не нужно его передавать в виде props в компонет.

Вы должны вызвать селектор с нужным списком пользовательских фильтров.

я переписал так, что filterList не просто берется из стейт, а модифицируется. Те я передаю filterMapStateToProps, который возвращается {filter}, но мне нужно {filter, something1} и {filter, something2}

может в гист написать полный пример?

Именно

Именно

те написать?

Именно = Да

https://gist.github.com/Yadro/e4e74cd04df316195ddc19dd9909eaae

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

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

Фильтер не нужно передавать в компонет.

Фильтрацию, как я писал ранее нужно делать в mapStateToProps.

И системные фильтры переместить в selector-ы.

Фильтрацию, как я писал ранее нужно делать в mapStateToProps.

дак я и показал mapStateToProps, по моему мнению) filter: [ ...systemFilter, ...state.filter ] хочу чтобы в одном месте

Повторяю в третий раз - вы это делаете в selector-е.

const systemFilterList = [ doc => doc.type != 1, doc => doc.type != 2, doc => doc.name != 'bla', ] const selectFiltered = (state, customFilterList) => { const filterList = [ ...customFilterList, ...systemFilterList ] // USE IT }

значит мне нужно почитать что есть селекторы

А в mapStateToProps: const mapStateToProps = state => ({ filteredData: selectFiltered(state, state.customFilterList) })

в принципе логично

можете подсказать как убрать эту ошибку?

XMLHttpRequest cannot load http://localhost:3001/socket.io/?EIO=3&transport=polling&t=Li4qipF. The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:3000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

пытаюсь сделать чат с клиента на реакте на сервер на ноду

с 3000 локалхоста на 3001 запросы

на ноде вроде все разрешено

Включи корс на ноде

Включи корс на ноде

не работает

я думаю возможно это react-create-app что то меняет в запросе

нода самая простая сейчас, на 10 строчек

как правильно передавать props в компонент в React Router. <Route path="/" component="вот в этот компонент"?>

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

А что за возня вышла?

Асинхронные роуты нельзя просто так перезагрузить при изменениях, плюс в react-router =< 3 wontfix issue, спамит в консоль warning`ами, все советуют патчить console.warn ? Выкинул реакт-роутер

исправил мою ошибку добавив "proxy": "http://localhost:3001", в package.json на клиенте, но так и не понял как это все работает

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

ну так он же тебе пишет что ты cors запрос отправляешь. видно же что у тебя сервак и js приложение на разных портах, конечно он тебе будет кидать такой ворнинг. у тебя два варианта, либо отдавать статику нодовским серваком (ну конечно можно поставить проксю, типа nginx и им отдавать и проксировать запросы еще на нодовскую прилагу), либо отдавать уже серваком хэдер Access-Allow-Origin

ERROR: S client not available

ну так он же тебе пишет что ты cors запрос отправляешь. видно же что у тебя сервак и js приложение на разных портах, конечно он тебе будет кидать такой ворнинг. у тебя два варианта, либо отдавать статику нодовским серваком (ну конечно можно поставить проксю, типа nginx и им отдавать и проксировать запросы еще на нодовскую прилагу), либо отдавать уже серваком хэдер Access-Allow-Origin

я вначале пытался второй вариант настроить, с ноды, но там все равно блочилось

const cors = require('cors'); app.use(cors());

или app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); next(); });

или один из этих

// io.set('origins', '*:*'); // io.set( 'origins', '*domain.com*:*' ); // io.set('origins', 'http://localhost:3000');

Асинхронные роуты нельзя просто так перезагрузить при изменениях, плюс в react-router =< 3 wontfix issue, спамит в консоль warning`ами, все советуют патчить console.warn ? Выкинул реакт-роутер

Там же уже 4й, теперь нормальный :)

snipet - propTypes.isDefined

Возможность prop быть null и при этом isRequired const isDefined = (props, propName, componentName) => typeof props[propName] === 'undefined' && new Error('${ propName } undefined')

Там же уже 4й, теперь нормальный :)

Там разве есть асинк роуты ? Вроде только через свой HOC

https://github.com/jtmthf/react-router-match-async

Реализовать это 10-20 строчек

Тут вопрос скорее почему это не в кор

Гайз, а поясните чем тайпскрипт так плох? (Чето его просто все тут хейтят, приколы всякие про него)

Вот тут не хейтят https://t.me/typescript_ru

Гайз, а поясните чем тайпскрипт так плох? (Чето его просто все тут хейтят, приколы всякие про него)

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

Гайз, а поясните чем тайпскрипт так плох? (Чето его просто все тут хейтят, приколы всякие про него)

Typescript - не плох. Он не годится для начальных стадий развития проекта или если вы собираетесь много рефакторить продукт. В остальном только плюсы.

Вот тут не хейтят https://t.me/typescript_ru

Не правда)

там есть хейтеры

Typescript - не плох. Он не годится для начальных стадий развития проекта или если вы собираетесь много рефакторить продукт. В остальном только плюсы.

красивая популярная легенда

НЕ ГОДИТСЯ

ок

Это мнение, собственное.

Он не годится ни для каких стадий проекта

рефакторить без тс проще да?

Да

и вкручивать надо на поздних стадиях, и не рефакторить. клааасс

какая полезная штука (интересно чем? и зачем тогда вообще это делать?)

из сообщения Павла выходит, что ТС надо вкручивать когда проект сдох

збс занятие

ТС не надо вкручивать никогда

да да