将 redux-form 集成到当前正在进行的项目中

Question

我不知道如何将 redux-form 集成到我当前工作的项目中。

我不知道如何将redux-form reducer集成到项目提供给我的已经给定的功能reducer中。此功能 returns 当前有 2 个键：{name, model} 对应用程序很重要，无法删除。

你们中有些人知道我应该如何进行吗？

这是我的文件：（为了简洁起见，我将它们缩短了）

myGivenReducer.js

const modelReducer = (model = {}, action = {}) => {
    switch (action.type) {
      //blah blah...
    }
}

export default function reducer(state = {}, action = {}) {
    const checkoutModel = modelReducer(state.model, action);
    return {
        name: state.name || 'unnamed',
        model: checkoutModel
    };
}

myStoreCreator.js

let data = {name, model: props};

let storeEnhancer = (process.env.NODE_ENV === 'local') ? DevTools.instrument : (() => (next) => next);

store = compose(storeEnhancer())(createStore)(myReducer, data);

contactForm.js

// exactly like redux-form tutorial sample code 
http://redux-form.com/6.5.0/docs/GettingStarted.md/

提示：

我已经尝试在 reducer 函数中添加一个新键 {form: reduxForm}，但它不起作用。

如果我使用 combine reducer（下图），表单有效！但键 {'name','model'} 不再通过应用程序传递。所以这不是一个有效的解决方案。

const combinedReducer = combineReducers({
    form: formReducer,
    model: myReducer()['model'],
    name: myReducer()['name']
})

希望你们中的一些人能给我一些想法！（事实上，我认为更多关于 Javascript 来自 redux-form 本身..）

干杯。

Answer 1

尝试...

// dont forget to import the redux-form reducer
import { reducer as formReducer } from 'redux-form';

export default function reducer(state = {}, action = {}) {
  const checkoutModel = modelReducer(state.model, action);
  return {
    name: state.name || 'unnamed',
    model: checkoutModel,
    form: formReducer(state.form, action)
  };
}

将 redux-form 集成到当前正在进行的项目中

Integrate redux-form in current ongoing project

javascript

redux-form

react-redux