Question

获取某个reducer的状态会出现整个困难（因为combineReducers）直到我使用它才出现这个问题combineReducers

减速器

const initialState = {
    caffe: [
        {
            city: "Name",
            people: "512512521",
            caffe: [
                {
                    title: "Name caffe",
                    about: "about",
                    imgLink: 'caffe',
                    url: 'urlcoffe'
                },
            ]
        }

const newcaf = (state = initialState, action) => {
    switch (action.type) {
        default:
            return  state;         
    }
}
export default newcaf;

组合减速器

import {combineReducers} from 'redux';
import caffe from './caffe'

export default combineReducers ({
    caffe
});

Index.js（商店）

普通鹳

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

import { createStore } from 'redux';
import { Provider } from 'react-redux';
import rootReducer from './reducers';



const store = createStore(rootReducer, window.__REDUX_DEVTOOLS_EXTENSION__
    && window.__REDUX_DEVTOOLS_EXTENSION__());



ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>,
  </React.StrictMode>,
  document.getElementById('root')
);

列出咖啡馆

问题就在这里

function BlockListAdmin() {
    const caffe= useSelector(); // * how to take store from redux
    console.log(caffe)
    return (
        <>
            <div className='container'>
                <h1>Hello</h1>
    {caffe}
            </div>
        </>
    )
}

Answer 1

你只需要传递一个函数给 useSelector 来读取 store 中的状态，例如：

function BlockListAdmin() {
    const selectCaffe = state => state.caffe[0].caffe[0].title;
    const caffe= useSelector(selectCaffe); // * how to take store from redux
    console.log(caffe)
    return (
      <div className='container'>
         <h1>Hello</h1>
            {caffe}
      </div>
    )
}

如何使用 useSelector 访问特定的 redux

1 个答案: