simple-redux-connect

1.0.5 • Public • Published

simple-redux-connect

对react-redux中的connect进行封装,使其避免多次写mapStateToProps,mapDispatchToProps之类的重复的逻辑;并且,可以按需引入我们需要用到的store中的内容,这里举例用的是main。该模块已经集成react-redux中的connect,不必单独下载。

Install

$ npm install simple-redux-connect

Usage

before(之前我们这样做)

//需要Provider时,这样引入 
import { Provider } from 'react-redux'
//引入connect和actionCreators
import { connect } from 'react-redux'
import actionCreators from '../../store/home/actionCreators' 

const mapStateToProps = (state) => {
  return {//返回需要的模块(这里是store中的main)中的属性
    list: state.main.list

  }
}

const mapDispatchToProps = (dispatch) => {
  return {//返回actionCreators方法

    getSwiperListAsync() {
          dispatch(actionCreators.getSwiperListAsync())
      }
  }
} 
export default connect(mapStateToProps, mapDispatchToProps)(UIcomponent)
 

now,we can(现在,我们这样做,是不是方便很多呢)bingo!

//需要Provider时,这样引入
import { Provider } from 'simple-redux-connect'
//引入我们封装的connect模块
import { connect } from 'simple-redux-connect'

//传入我们需要的模块,这里是(main)
export default connect(UIcomponent, [{name: 'main', state: ['list']}])//main:your store,list:your state

or

//需要Provider时,这样引入
import { Provider } from 'simple-redux-connect'
//引入我们封装的connect模块
import  { connect } from 'simple-redux-connect'

//传入我们需要的模块,这里是(main)
export default connect(UIcomponent, [ 'main'])//main:your store

Package Sidebar

Install

npm i simple-redux-connect

Weekly Downloads

0

Version

1.0.5

License

ISC

Unpacked Size

4.23 kB

Total Files

4

Last publish

Collaborators

  • miaojiang