react+dva+ts 中的store状态库,创建方式

接下来说的是dva中的store仓库,类似于react中的redux

首先呢我们是要把每一个状态store放入dva中

const app=dva({})

所有的都要放dva中的model中

app.model({
    namespace:"login",//一个简单的名字,命名空间

    state:[1,2,3],//默认状态

    reducers:{//reduce

        //dispatch调用

        add(state){

            return state

        }

    }

})

这样就创建了一个简单的了,但是我们需要很多很多,这样是不是太麻烦了呢

接下来看我表演
src/store/index,在这个文件中操作

src/store/model,在这个文件中干很多很多的

const context = require.context('./module', false, /\.js$/);

//引入每一个store的文件规范

const getModel = context.keys().map(key => context(key));

export function createModel(app) {

    //根据传进来的APP进行循环加入

    return getModel.map(key => app.model(key.default));

}

接下来就在src/store/model中建立文件就完事了


在页面中访问方式
使用dva中的connect

import {connect} from 'dva'

使用高逼格需要。babelrc中定义


{

    "plugins": [["@babel/plugin-proposal-decorators", { "legacy": true }]]

}

'##'通过@访问就行了,最终映射到props


@connect((store:any)=>{

  console.log(store);

  return store

})

你可能感兴趣的:(react+dva+ts 中的store状态库,创建方式)