React redux-react-hook

import React, { useState, useEffect, useCallback } from 'react'
import { useDispatch, useMappedState } from 'redux-react-hook';
import './styles.less'
import { hook } from '@/actions/hook'
import _ from 'loadsh'

export default function Counter() {
    const mapState = useCallback(state => {
        return {
            hookData: state.hook.hookData, // 获取 hookData 的 数据
        }
    })

    // 从 store 中读取 dispatch
    const dispatch = useDispatch()

    // data: 获取的所有数据
    const data = useMappedState(mapState)

    useEffect(() => {
    	// 调用 actions 里面hook的方法
        dispatch(hook())
            .then(res => {
                console.log(res, 'res');
            })
    }, [])

    console.log(data, 'data');

    return (
        

            {
                _.get(data, 'hookData', []).map((v, k) => {
                    return (
                        
{v.name}
                    )
                })
            }
        
    )
}

 

import React from 'react';
import ReactDOM from 'react-dom';

import 'antd/dist/antd.less';
import '@/styles/rem.js';
import '@/styles/iconfont.css'
import '@/styles/reset.css';
import './index.less';

import { StoreContext } from 'redux-react-hook'
import Router from './router'  // 路由
import { store } from './store'  //store
import { Provider } from 'react-redux'
import { persistStore } from 'redux-persist'   //数据持久化
import { PersistGate } from 'redux-persist/lib/integration/react'

ReactDOM.render(
    
        
            
                
            
        
    
    , document.getElementById('root'));

 

————————————————
版权声明：本文为CSDN博主「辅助辅助助辅」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_40924034/article/details/103946595