react todo例子有几点疑问，求解答

Question

import React from 'react'
import { render } from 'react-dom'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
import App from './containers/App'
import todoApp from './reducers'

import有的带大括号，有的不带大括号，是什么个情况呢

---

actions.js

export const ADD_TODO = 'ADD_TODO';
export function addTodo(text) {
    return { type: ADD_TODO, text }
}

reducers.js

function visibilityFilter(state = SHOW_ALL, action) {
    switch (action.type) {
        case SET_VISIBILITY_FILTER:
            return action.filter
        default:
            return state
    }
}

function todos(state = [], action) {
    switch (action.type) {
        case ADD_TODO:
            return [
                ...state,
                {
                    text: action.text,
                    completed: false
                }
            ]
        case COMPLETE_TODO:
            return [
                ...state.slice(0, action.index),
                Object.assign({}, state[action.index], {
                    completed: true
                }),
                ...state.slice(action.index + 1)
            ]
        default:
            return state
    }
}

组件

<AddTodo
    onAddClick={text =>
        dispatch(addTodo(text))
        } />

点击后怎么就能自动匹配reducers.js中的todos函数呢， 哪里都找不到调用todos的代码，为什么没匹配visibilityFilter函数，

Answer 1

这个是根据模块的定义来引入的，你可以去网上看一下，export，export default这两个的区别。有时候需要用export来模块化，有时候完全可以用export default来把整个代码都模块化。只用export模块化的，你需要用花括号来指出你要引入的模块的子模块的名字，而export default来模块化的，你只用 export default xxx中的xxx引入进来就可以。这个跟redux什么的无关，是es6模块化中两种模块化方式的不同之处。react的很多模块其实两种引入方式都支持的，望参考。

Answer 2

1. ES6 导入导出，不带大括号是全部导入，带大括号是部分导入。详见https://github.com/YutHelloWo...

2. redux概念
   createStore把reducer和action联系到了一起

   const store = createStore(reducer)
   // dispatch一个action就能触发reducer
   store.dispatch(action)

   详见：https://github.com/YutHelloWo...

Answer 3

1：这个是 ES6 模块
2：先把 redux 的文档看一遍吧
3：看下 MD 的语法，修改下你这问题的语法高亮