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

Question

Я создал адаптивное меню с общим компонентом навигации, внутри которого есть компонент ссылки. Итак, Панель инструментов> Nav> Link. У меня также есть боковая панель (мобильное меню), которая разделяет компоненты навигации и ссылки: боковая панель> навигация> ссылка.

Таким образом, у меня был некоторый успех с переключением значка «Закрыть» и «Меню», отображением и скрытием боковой панели мобильного устройства без использования Redux. Но я понимаю, что с вложением, пропуская реквизиты за пределы родительского и дочернего я не работал, поэтому я решил попробовать Redux, но настройка немного сложна, я попытался использовать console.log, чтобы увидеть, что происходит, но действия не Кажется, подписка или что-то не подключается, чтобы обновить состояние.

Может ли кто-нибудь помочь мне увидеть, что происходит?

Редактор проекта находится здесь, хотя на нем есть проблема с транспортом ES5 / ES6, я попытался установить там Babel, но не уверен, как решить проблему в Stackblitz. Код и структура файла там: https://stackblitz.com/edit/react-xey1dv

Answer 1

Сначала вам нужно изменить mapStateToProps для прослушивания определенных значений пропов, таких как isOpened в редукторе.

const mapStateToProps = state => {
  return {
    isOpened: state.isOpened
  };
};

А затем в toggleNav вы должны проверить состояние этого объекта с помощью 'this.props',

if (!this.props.isOpened) {
      openNavigation();
      console.log('active');
    }
    else {
      closeNavigation();
      console.log('not-active');
    }