1. значения фильта все равно нужно хранить в стейте

2. эти значения можно менять как из фильтра таблицы, так и из любых внешних источников

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

4. эти значения из стейта можно отображать и редактировать в других внешних элементах

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

1. значения фильта все равно нужно хранить в стейте

всё верно, более того, таблица и так это делает, и позволяет поддерживать поля ввода в React-way, то есть с завязкой value на state. (что даёт бонусом корректную синхронизацию, если у нас два и более одиннаковых поля) https://react-table.js.org/#/story/custom-filtering 2, да, но при внешнем измменении требуется идентификация поля по айди, в то время как при кастомных фильтрах у нас есть колбек. 3, + 4, + Проблемы нет в том, чтобы их менять и редактировать снаружи. Это возможно. Но это не удобно и требует модификации (п.2), и лишает некоторых важных приемуществ, которыми я пользуюсь сейчас. К примеру, таблица сама создаёт за меня именно нужное количество фильтров. Определять отдельно вручную, какие фильтры мне нужны сейчас (а колонок у меня больше 25 , и фильтров примерно 10 видов) потребует дополнительного усложнения и большего потребления ресурсов, в то время как сейчас всё работает почти "из коробки". Триггериться тоже не проблема - стейт фильтрации доступен. Хочу иметь доступ к пропсам фильтра откуда-то снаружи. По ref я могу их получить, и размазать по новому внешнему компоненту, но мне кажется клонировать было бы правильнее.

всё верно, более того, таблица и так это делает, и позволяет поддерживать поля ввода в React-way, то есть с завязкой value на state. (что даёт бонусом корректную синхронизацию, если у нас два и более одиннаковых поля) https://react-table.js.org/#/story/custom-filtering 2, да, но при внешнем измменении требуется идентификация поля по айди, в то время как при кастомных фильтрах у нас есть колбек. 3, + 4, + Проблемы нет в том, чтобы их менять и редактировать снаружи. Это возможно. Но это не удобно и требует модификации (п.2), и лишает некоторых важных приемуществ, которыми я пользуюсь сейчас. К примеру, таблица сама создаёт за меня именно нужное количество фильтров. Определять отдельно вручную, какие фильтры мне нужны сейчас (а колонок у меня больше 25 , и фильтров примерно 10 видов) потребует дополнительного усложнения и большего потребления ресурсов, в то время как сейчас всё работает почти "из коробки". Триггериться тоже не проблема - стейт фильтрации доступен. Хочу иметь доступ к пропсам фильтра откуда-то снаружи. По ref я могу их получить, и размазать по новому внешнему компоненту, но мне кажется клонировать было бы правильнее.

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

чего там не хватает?

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

кастомный фильтр создаётся следующим способом (пример из доков): Filter: ({ filter, onChange }) => <select onChange={event => onChange(event.target.value)} value={filter ? filter.value : "all"} > <option value="all">Show All</option> ... </select> filter - это обьект, по умолчанию undefined, содержащий информацию о изменении поля фильтра (айдишник, новое значение, кажется что-то еще). Подобный обьект передаётся в filterMethod Вариант решения моей задачи - аккуратно иметь filter и onChange где-то еще (плиз, не в редаксе). По ссылке я их могу получить, но зачем ограничиваться только ими. Ещё важно иметь всегда актуальное количество и тип фильтров - точно такой же, как в шапке таблицы. То есть я ну очень не хочу определять, какие фильтры отображены, и согласно полученной информации создавать такие же фильтры снаружи. Сейчас есть идея как-то собирать создавшиеся ссылки и потом копировать по ним необходимое количество элементов вместе с их пропсами и т.д.

кастомный фильтр создаётся следующим способом (пример из доков): Filter: ({ filter, onChange }) => <select onChange={event => onChange(event.target.value)} value={filter ? filter.value : "all"} > <option value="all">Show All</option> ... </select> filter - это обьект, по умолчанию undefined, содержащий информацию о изменении поля фильтра (айдишник, новое значение, кажется что-то еще). Подобный обьект передаётся в filterMethod Вариант решения моей задачи - аккуратно иметь filter и onChange где-то еще (плиз, не в редаксе). По ссылке я их могу получить, но зачем ограничиваться только ими. Ещё важно иметь всегда актуальное количество и тип фильтров - точно такой же, как в шапке таблицы. То есть я ну очень не хочу определять, какие фильтры отображены, и согласно полученной информации создавать такие же фильтры снаружи. Сейчас есть идея как-то собирать создавшиеся ссылки и потом копировать по ним необходимое количество элементов вместе с их пропсами и т.д.

columns для таблицы где формируется?

columns для таблицы где формируется?

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

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

вся эта инфа есть вэтом массивчике же

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

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

ну хз... завтра понадобится на странице 10 разных таблиц выводить и переключаться табами между их фильтрами :)))

и будет попа

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

более того, у колонки есть аттрибут show, который если false, скрывает и колонку и фильтр автоматически. Вот еще бы мне попроверять на кучу условий необходимость создания фильтра для колонки, а потом его тип, а потом отдельный колбек для него, отдельный api - нет нет, увольте.

ну хз... завтра понадобится на странице 10 разных таблиц выводить и переключаться табами между их фильтрами :)))

не понадобится. Есть одна большая (жопа).

кроме того, если вдруг таблица размаунтится раньше твоего внешнего фильтра тоже могут быть вопросы

т.к. свойства filter и onChange переданные в компонент фильтра будут забиндены на табличный компонент

кроме того, если вдруг таблица размаунтится раньше твоего внешнего фильтра тоже могут быть вопросы

верно. сейчас это работает нормально с порталами, и не unmount раньше чем надо.

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

отсюда и проблема на ровном месте

отсюда и проблема на ровном месте

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

не хочешь через редакс прокидывать фильтры, сделай через context api новый

воткни провайдера над обеими компонентами

а в них консумеров и все

не хочешь через редакс прокидывать фильтры, сделай через context api новый

я не вижу необходимости обмазывать редаксом то, что и так работает.

воткни провайдера над обеими компонентами

"над обеими компонентами" какими?

ну так чтобы провайдер был выше и внешнего фильтра и выше таблицы по иерархии

в провайдере уже храни сам фильтр и методы его меняющие

ну так чтобы провайдер был выше и внешнего фильтра и выше таблицы по иерархии

и передавать в него и колбек и обьект filter? так это ничего мне не даёт. Я могу прямо компонент закинуть туда и потом его в двух местах вернуть?

можешь

можешь там фабрику даже сделать для создания таблицы и фильтра

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

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

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

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

Привет Как заменить env var в файле, который импортируется в таску gulp? В самой таске переменные правильные, а вот файл, который я импортирую - класс, дата хендлер, мне нужно оттуда запустить пару методов, чтобы получить данные с сервера, но для дева - нужно запрос на локальный сервер, для stg - на stg, а для продакшена - на прод Кто нибудь сталкивался??

Привет Как заменить env var в файле, который импортируется в таску gulp? В самой таске переменные правильные, а вот файл, который я импортирую - класс, дата хендлер, мне нужно оттуда запустить пару методов, чтобы получить данные с сервера, но для дева - нужно запрос на локальный сервер, для stg - на stg, а для продакшена - на прод Кто нибудь сталкивался??

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

Эт просто: 1) Я там не сижу 2) В чатике ноды меня просили пройти на фронт 3) Галп - фронт

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

с каких пор task manager gulp стал фронтом ? ):))

Его на сервер не крутят (насколько мне известно) И чувак, мне помощь нужна, а не философские обсуждения о галпе

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

Надо мне работу сменить

Хорошо, даже убрав галп, суть вопроса даже не столько в нем, а сколько в том, как менять evn var в импортируемом файле

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

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

Меня нахуй скорее пошлют ?

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

я им лью по фтп ))

я либо не нашел, либо такой возможности пока просто нет, но антовский селект не умеет { key, value } options-ы

?‍♂️ Заметка писалась год назад, я уже не помню что там с антом ?

Привет) Как прикрутить валидацию на checkbox проверять checked true||false

привет! подскажите пожалуйста почему он ругается на Access-Control-Allow-Origin хотя я его указал. Ошибка: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access. axios({ method: "POST", url: `${ROOT_URL}/auth`, headers: { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods' : 'POST', 'Content-Type': 'application/json;charset=UTF-8', 'App-Token': AppToken, }, data: { email: values.email, password: values.password }, })

Я перечитал все первые ссылки про сессии и куки. Со вторыми более-менее все понятно, но с сессиями - совсем плохо. Как я понял, это просто файл с ID, в втором хранится пользовательская инфа? Эта инфа берётся из северной бд, верно? Но разве это целесообразно? Придётся создавать файлы для сессии.

привет! подскажите пожалуйста почему он ругается на Access-Control-Allow-Origin хотя я его указал. Ошибка: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access. axios({ method: "POST", url: `${ROOT_URL}/auth`, headers: { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods' : 'POST', 'Content-Type': 'application/json;charset=UTF-8', 'App-Token': AppToken, }, data: { email: values.email, password: values.password }, })

Во первых корсы настраиваются на сервере, во вторых никогда не ставьте '*'

Пока писал, понял, что Сессии + куки == сеансовый протокол

привет! подскажите пожалуйста почему он ругается на Access-Control-Allow-Origin хотя я его указал. Ошибка: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access. axios({ method: "POST", url: `${ROOT_URL}/auth`, headers: { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods' : 'POST', 'Content-Type': 'application/json;charset=UTF-8', 'App-Token': AppToken, }, data: { email: values.email, password: values.password }, })

так без него так же

ERROR: S client not available

Во первых корсы настраиваются на сервере, во вторых никогда не ставьте '*'

это запрос api

это запрос api

и?

и?

поэтому думал нужно указать 'Access-Control-Allow-Origin': '*',

теперь буду знать

и?

не шаришь ты, вот что “и” ) хаха) доброе утро.

теперь буду знать

бэк то на чем? есть возможность заголовки поставить?

поэтому думал нужно указать 'Access-Control-Allow-Origin': '*',

в Access-Control-Allow-Origin перечисленные доверенные ресурсы. Этот заголовок указывает сервер с которого хостится статика собственно. * - означает доверять ВСЕМ, что является серьёзной потенциальной дырой в безопасности. Просто либо укажи там путь к api серверу, либо закрой сделай на хостинге проксю к апи и с клиента ходи на эту "локальную" проксю. (второй вариант предпочтительней)

в Access-Control-Allow-Origin перечисленные доверенные ресурсы. Этот заголовок указывает сервер с которого хостится статика собственно. * - означает доверять ВСЕМ, что является серьёзной потенциальной дырой в безопасности. Просто либо укажи там путь к api серверу, либо закрой сделай на хостинге проксю к апи и с клиента ходи на эту "локальную" проксю. (второй вариант предпочтительней)

обновил

значит надо попросить “программиста” другого сайта проставить заголовки

значит надо попросить “программиста” другого сайта проставить заголовки

нет же, заголовок на хостере указывается

тогда не понимаю почему он ругается

нет же, заголовок на хостере указывается

эм.. ты когда код пишешь и размещаешь его у хостера, ты за него и отвечаешь же)

тогда не понимаю почему он ругается

в смысле? причина не изменилась же. У стороннего ресурса нет вас в разрешенном списке для запросов

да, это пиздец, может приводить к утечкам памяти в браузере к тому же

Ты чёт забыл что такое утечка

эм.. ты когда код пишешь и размещаешь его у хостера, ты за него и отвечаешь же)

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

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

а, посмотрел на скрин. думаю ты прав

так у меня до этого заходило! но сейчас нет!

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

так у меня до этого заходило! но сейчас нет!

Расспиши (одним сообщением) детальнее что было, как стало и какое окружение

Опиши одним сообщением. Не нужно по всему чату разбрасывать куски информации

сначала я сделал так let axiosConfig = { headers: { 'Content-Type': 'application/json;charset=UTF-8', 'App-Token': AppToken, } }; let formData = { email: email, password: password }; const request = axios.post(`${ROOT_URL}/auth`,formData, axiosConfig); request .then(response => { // -Save the JWT token localStorage.setItem('token', response.data['auth_token']); все работало! после решил сделать его норм после чего выводится такая ошибка

"его норм"?

сначала я сделал так let axiosConfig = { headers: { 'Content-Type': 'application/json;charset=UTF-8', 'App-Token': AppToken, } }; let formData = { email: email, password: password }; const request = axios.post(`${ROOT_URL}/auth`,formData, axiosConfig); request .then(response => { // -Save the JWT token localStorage.setItem('token', response.data['auth_token']); все работало! после решил сделать его норм после чего выводится такая ошибка

!ро 10 минут читать правила https://rudevs.network/SJnVLYQm7

Парни,сталкивался кто, что ref положенный в store redux вешает redux devtools?

?‍♂️?‍♂️?‍♂️

Парни,сталкивался кто, что ref положенный в store redux вешает redux devtools?

Не надо так делать

Через попсы очень далеко, общий предок далеко