美文网首页
Redux 仓库拆分

Redux 仓库拆分

作者: Poiey | 来源:发表于2019-12-24 21:37 被阅读0次

构建一个项目时,一个仓库组件往往放不了那么多数据,并且后期很难管理,不易维护,仓库拆分可以将仓库数据以模块化的形式存储。

这里创建的 store/index.js 仅仅是引入其他组件的仓库数据

//store / index.js
import { createStore } from 'redux'
import reducer from './todu'

const store = createStore(reducer,window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
export default store
// todu / index.js
const initState = {
    inputvalue:'',
    todus : [
        '吃饭',
        '睡觉'
    ]
}
const reducer = (state = initState , action)=>{
    if(action.type === 'CHANGE_CON'){
        return state={
            ...state,
            inputvalue: action.value
        }
    }else if(action.type==='DELETE_LI'){
        let newState = JSON.parse(JSON.stringify(state))
        newState.todus.splice(action.index,1)
        return state={
            ...state,
            todus:newState.todus
        }
    }else if(action.type==='ADD_LIST'){
        let newState = JSON.parse(JSON.stringify(state))
        newState.todus.push(state.inputvalue)
        return state={
            ...state,
            todus:newState.todus
        }
    }
    return state
}
export default reducer

这里只分出一个仓库数据,还可以继续拆分。

相关文章

  • Redux 仓库拆分

    构建一个项目时,一个仓库组件往往放不了那么多数据,并且后期很难管理,不易维护,仓库拆分可以将仓库数据以模块化的形式...

  • redux之combineReducers使用介绍

    前言 redux的combineReducers()可以方便的将redux的reducer拆分为各个小的reduc...

  • redux学习笔记

    什么是redux架构 //首先我们应该认识redux的核心store,store直译过来就是仓库,redux概念中...

  • [JavaScript] 拆分Redux

    Redux是用来管理程序状态的工具,它提供了一些高阶函数让功能越来越丰富。 1. 用reducer根据action...

  • RN:React-Redux

    目录一. React-Redux是什么 1. React-Redux的组件拆分规范  1.1 UI组件  1.2 ...

  • 上手redux中间件,有这篇文章就够了!

    用过react的同学都知道在redux的存在,redux就是一种前端用来存储数据的仓库,并对改仓库进行增删改查操作...

  • redux-拆分state

    一个最小的redux实例 合并到成一个新的state 使用

  • Redux-saga 中间件

    Redux-saga和thunk一样,可以进行异步代码的拆分。不同的是redux thunk是将异步代码放入act...

  • 第一章:快速开始

    快速开始 React Redux 是React官方认可的Redux,他可以让你的React组件在一个React仓库...

  • Git多分支平行发展(一个仓库包含多个不同的项目)

    主要步骤: 创建git本地仓库并关联远程仓库(已有仓库) 在远程和本地仓库中新建一个分支(redux) 将新项目的...

网友评论

      本文标题:Redux 仓库拆分

      本文链接:https://www.haomeiwen.com/subject/cytqoctx.html