美文网首页
dva中的@connect到底是什么

dva中的@connect到底是什么

作者: 香喷喷啦啦啦66 | 来源:发表于2019-11-12 14:34 被阅读0次

    connect

    connect是dva中的一个函数,用来绑定model和view的

    import { connect } from 'dva';
    
    function mapStateToProps(state) {
      return { todos: state.todos };
    }
    connect(mapStateToProps)(App);
    

    其中connect函数后的两个参数:
    mapStateToProps可以理解为我们平时用到的model层,而App则是view组件

    简而言之,connect接收一个函数,返回一个函数。

    第一个函数会注入全部的models,你需要返回一个新的对象,挑选该组件所需要的models。

    export default connect(({ user, login, global = {}, loading }) => ({
    currentUser: user.currentUser,
    collapsed: global.collapsed,
    fetchingNotices: loading.effects['global/fetchNotices'],
    notices: global.notices
    }))(BasicLayout);
    
    // 简化版
    export default connect(
    ({ user, login, global = {}, loading }) => { return {
    currentUser: user.currentUser,
    collapsed: global.collapsed,
    fetchingNotices: loading.effects['global/fetchNotices'],
    notices: global.notices
    }
    }
    )(BasicLayout);
    
    

    @connect

    @connect的使用

    其实只是connect的装饰器、语法糖罢了。

    // 将 model 和 component 串联起来

    export default connect(({ user, login, global = {}, loading }) => ({
    currentUser: user.currentUser,
    collapsed: global.collapsed,
    fetchingNotices: loading.effects['global/fetchNotices'],
    notices: global.notices,
    menuData: login.menuData, // by hzy
    redirectData: login.redirectData, // by hzy
    }))(BasicLayout);
    

    相关文章

      网友评论

          本文标题:dva中的@connect到底是什么

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