Как создать фильтр товаров на react, если фильтр и товары выводястя в разных компонентах?

Максим, Разобралась, но только с одним редьюсером получилось, не пойму как можно разделить на 2 редьюсера. Ну для первого раза думаю пойдет, так как важно чтобы все работало, а добиться этого же результата только более правильным путем видимо только с опытом можно ). Спасибо за помощь!

Как создать фильтр товаров на react, если фильтр и товары выводястя в разных компонентах?

Максим, Только что поняла, что учусь по Вашим учебникам ) Примите слова благодарности, делаете действительно крутую работу!

Как создать фильтр товаров на react, если фильтр и товары выводястя в разных компонентах?

Хотя вроде пришло понимание ) надеюсь )
Если в редьюсер добавлю

case 'FILTER':
    return { ...state, products: action.payload, isFetching: false, error: '' }

а в ProductsActions

export const filterProducts = colors => (dispatch, getState) => {
  dispatch({
    type: 'FILTER',
    payload: getState().products.products.filter(product => colors.includes(product.color)),
  })
}

и в компоненте фильтра вызывать this.props.filterProducts(['red', 'green']), то все работает. Это правильно, или есть более правильный подход? )

Как создать фильтр товаров на react, если фильтр и товары выводястя в разных компонентах?

И еще - что считается хорошей практикой - фильтр на стороне сервера или на клиенте?

Как создать фильтр товаров на react, если фильтр и товары выводястя в разных компонентах?

Редьюсер:

export function products(state = initialState, action) {
    switch (action.type) {
        case GET_PRODUCTS_REQUEST:
            return { ...state, products: [], isFetching: true, error: '' }

        case GET_PRODUCTS_SUCCESS:
            return { ...state, products: action.payload, isFetching: false, error: '' }

        case GET_PRODUCTS_FAIL:
            return { ...state, error: action.payload.message, isFetching: false }

        default:
            return state
    }
}

ProductContainer

const mapStateToProps = store => ({ products: store.products })

const mapDispatchToProps = dispatch => ({
    getProducts: () => dispatch(getProducts()),
})

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(ProductsContainer)

Вроде все правильно тут, но вот дальше не соображу как быть

Как правильно прописать :nth-child?

Спасибо! Только js остается, второй вариант увы не подходит

Как правильно прописать :nth-child?

Да уж, теперь разобралась как работает nth-child. Предложенный Вами вариант разумеется рабочий, но как уже писала выше - все это происходит в блоке с contenteditable, то есть через редактор tinymce, поэтому там по дефолту используются именно теги p, можно конечно подхимичить и сработает, но просто думала может есть решение на css, но видимо без js никак ) спасибо за ответ.

Как правильно прописать :nth-child?

Ankhena, да, точно, спасибо за подсказку

Как правильно прописать :nth-child?

zoozag, через js уже была идея, но проблема в том, что все это происходит в блоке с contenteditable, то есть редактируется, добавляется, удаляется и т.д.. в конечном счете сохраняется, так что при каждом изменении видимо придется подкрашивать как надо и перед сохранением очищать от лишних атрибутов style, печалька (

Как правильно прописать :nth-child?

zoozag, Да, похоже что так и работает, но све же это странно и надо как-то найти способ обойти эту фичу? или особенность )

Как отсортировать массив?

Как всегда все элементарно ) Спасибо!

Как отсортировать массив?

Да это я тоже знаю, но вот такая задачка возникла, вот и голову ломаю. Честно говоря, даже не знаю как это загуглить )

Как найти алгоритм?

Mercury13, Да, этим и развернут ) и это как раз и надо было ) Думала сама додумаюсь как делать если 4 или 5 элементов надо, главное суть понять, а Вы рассказали и вроде все получилось теперь. Еще раз спасибо! Над счетчиком подумаю как время будет )

Как найти алгоритм?

Хоть и все отвечающие дали один и тот же ответ, но Ваш весьма содержательный и появилось представление как решать такие задачи. Благодарю! ) Если знаете, можете подсказать что можно почитать по теме, кроме как комбинаторики? Имею ввиду с уклоном на программирование.

Подсветка столбца/строки таблицы?

lukoie, ну вот никак не догоню как это сделать ) видимо опыта не хватает, так как только учусь

Подсветка столбца/строки таблицы?

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

Безопасен ли VPN работодателя?

ky0: все понятно, спасибо за информацию! )

Безопасен ли VPN работодателя?

благодарю за внятное разъяснение. В комментарии выше как раз писала насчет строки route XX.XXX.XX.XX 255.255.255.255, думается что только к одному ip идет подключение по впн, это верно? То есть, например, если я захожу на яндекс/гугл да и любой другой сайт, то этот впн как бы не в курсе? Или трафик все равно идет через него?

Безопасен ли VPN работодателя?

мне смущает вот эта строчка - route XX.XXX.XX.XX 255.255.255.255 там указан ip работодателя. Вот точно никак не могу нагуглить, но есть догадка - не значит ли это, что только к одному ip буду подключаться через этот впн?

Безопасен ли VPN работодателя?

Ну вообще, я занимаюсь версткой. Верстка закачивается на сервер через ftp, дизайн тоже берется с того же сервера через тот же ftp. Какое-то извращения как по мне ) но что делать, тут не я диктую ) Ну и вот пока например скачается дизайн, если например у меня включен скайп, зайду проверить почту или еще что ) мало ли. Вот и интересно, смогут ли эти ребята угнать мои пароли?