Импорт / экспорт при использовании редукторов в Redux-React Native

Question

Я изучаю Redux с React Native, и у меня есть такой пример:

---

reducer.js

import {combineReducers} from "redux"; 
import {HomeReducer as home} from "../routes/Home/modules/home";

const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

export default makeRootReducer;

---

createStore.js

import {createStore, applyMiddleware, compose} from 'redux';
import thunk from "redux-thunk";
import {createLogger} from 'redux-logger';

import makeRouteReducer from './reducer';

const log = createLogger({diff: true, collapsed: true});

export default (initialState = {}) => {
    const middleware = [thunk, log];
    const enhancers = [];

    return store = createStore(
        makeRouteReducer(),
        initialState,
        compose(
            applyMiddleware(...middleware),
            ...enhancers
        )
    );
}

---

Работает нормально, но я не понимаю, почему я должен использовать export default в reducer.js .

Когда я пытаюсь использовать

// reducer.js
export makeRootReducer

и

// createStore.js
import {makeRouteReducer} from './reducer';

Это не сработало.

Пожалуйста, помогите мне, объяснив это подробно.

Большое спасибо.

Answer 1

Вы говорите о именованных экспортах и экспортах по умолчанию ...

Пример именованного экспорта:

export const someFunction = () => {
   // some code here...
}

Теперь вы можете импортировать это в другой файл, например так:

import {someFumnction} from './nameOfFile'

Но если вы сделаете:

export default function someFunction () {
   // some code here...
}

Это экспорт по умолчанию, и вы должны импортировать его следующим образом:

import someFunction from './nameOfFile'

В вашем примере, если вы измените это:

const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

export default makeRootReducer;

На это:

export const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

Это будет именованный экспорт, а не экспорт по умолчанию, и теперь вы можете сделать:

import {makeRootReducer} from....

Надеюсь, что прояснит ... А вот еще info