@kirillleogky

Как включить на проекте redux devtools?

Структура проекта:
5e6a57bfcb39f688109465.png



store.js:
import {combineReducers, createStore} from 'redux';
import reducer from '../reducers'

export default createStore(combineReducers(reducer, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()))





reducers/reducers.js
let search = {
  data: ''
};
let sort = {
  data: 'asc' // 'desc'
};

let fakeInfo = {
  data: []
}

let sortTitle = {
  data: []
}

let arrow = {
  data: ''
}

function firstData(state = search, action) {
  switch (action.type) {
    case 'CHANGE_SEARCH_DATA':
      return { ...state, data: action.payload }

    default:
      return state
  }
}

function secondData(state = sort, action) {
  switch (action.type) {
    case 'CHANGE_SORT':
      return { ...state, data: action.payload }

    default:
      return state
  }
}

function thirdData(state = fakeInfo, action) {
  switch (action.type) {
    case 'SET_DATA':
      return { ...state, data: action.payload }

    default:
      return state
  }
}

function fourthData(state = sortTitle, action) {
  switch (action.type) {
    case 'SET_SORT_TITLE':
      return { ...state, data: action.payload }

    default:
      return state
  }
}

function fifthData(state = arrow, action) {
  switch (action.type) {
    case 'CHANGE_ARROW':
      return { ...state, data: action.payload }

    default:
      return state
  }
}

export default {firstData, secondData, thirdData, fourthData, fifthData};




Подскажите почему не открывается расширение redux devtools в браузере?

пример с chrome:
5e6a58e39ec6a800887329.png
  • Вопрос задан
  • 58 просмотров
Решения вопроса 1
contraomnes
@contraomnes
Frontend developer
расширение передается 3 или, в вашем случае, 2 аргументом (enhancer), а не комбинируется с редьюсерами
export default createStore(combineReducers(reducer), initialState, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())


или

export default createStore(combineReducers(reducer), window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
miraage
@miraage
dev
Официальный NPM пакет, который инкаспулирует внутреннюю логику: https://www.npmjs.com/package/redux-devtools-extension
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы