hooks 中使用dva

hooks 中使用dva

reacts hooks已經問世好久了今天來記錄下如何在hooks是使用dva,
衆所周知函數是不能夠是不能夠使用修飾符修飾的,由於函數存在變量提高問題。
因此大多數人有選擇再次掏出本身的redux,可是redux使用起來確實沒有dva方便,那麼下面就讓咱們看看如何在hooks中優雅的使用dva吧!css

廢話很少說直接上代碼!react

index.js

import React from 'react';
import { connect } from 'dva';
import {Button} from 'antd';

const mapStateToProps = (state)=> {
  return {
    home: state.home,
  }
};

const usePage = (props) => {
const {home} = props;
  const btnClick = () => {
    const {dispatch} = props;
    dispatch({
      type:"home/getList",
      payload: !home.likes
    })
  };

  return (
    <div>
      <Button onClick={btnClick}>點擊有驚喜</Button>
      <span>{home.likes ? 'true' : 'false'}</span>
    </div>
  );
};
export default connect(mapStateToProps, null)(usePage);

model.js

export default {
  namespace: 'home',
  state: {
    likes: null,
  },
  effects: {},
  reducers: {
    getList(state, {payload}) {
      return {...state, likes: payload};
    },
  },
};

爲了簡單我連css以及反作用都不要了。夠簡單不? 不會還不會吧?redux

相關文章
相關標籤/搜索