Javascript 未从存储传递Redux Toolkit状态。反应还原

我正在尝试使用Redux工具包转换一个简单的React Redux项目。我使用configureStore创建了存储，但该存储似乎没有将初始状态传递给子组件

这是我的redux工具包（redux index.js）js文件

我的index.js

    import React from "react";
    import { render } from "react-dom";
    import { Provider } from "react-redux";
    import store from './redux-index';
    import App from "./App";

    render(
      <Provider store={store}>
        <App />
      </Provider>,
      // The target element might be either root or app,
      // depending on your development environment
      // document.getElementById("app")
      document.getElementById("root")
    );

---

在

mapstatetrops

中，

state

对象是Redux state对象（与从

store.getState（）获取的对象相同）

您的状态为
article
，它来自定义的切片：
名称：“article”
，因此您需要将其更改为：

const mapStateToProps = state => {
  return { articles: state.article.articles };
};

看

完全错误是什么？似乎大部分都被切断了，只显示了位置。我用更多日志更新了问题。谢谢！！成功了。语法与普通react-redux不同，这对我来说很奇怪。因为它不是一个钩子，所以当您可以使用
useSelector
时，您不需要使用
MapStateTrops
…谢谢您的提示。我仍然是新的反应和重复，所以我从基本开始。我将检查useSelector:）

    import React from 'react';
    import List from './components/List';
    import Form from './components/Form';

    const App = () => (
      <>
        <div>
          <h2>Articles</h2>
          <List /> 
        </div>
        <div>
          <h2>Add a new article</h2>
          <Form />
        </div>
      </>
    );

    export default App;


    import React from "react";
    import { connect } from "react-redux";

    const mapStateToProps = state => {
      return { articles: state.articles };
    };

    const ConnectedList = ({ articles }) => (
      <ul>
        {articles.map(el => (
          <li key={el.id}>{el.title}</li>
        ))}
      </ul>
    );

    const List = connect(mapStateToProps)(ConnectedList);

    export default List;



    Uncaught TypeError: Cannot read property 'map' of undefined
    at ConnectedList (List.js:9)
    at renderWithHooks (react-dom.development.js:14803)
    at mountIndeterminateComponent (react-dom.development.js:17482)
    at beginWork (react-dom.development.js:18596)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237)
    at invokeGuardedCallback (react-dom.development.js:292)
    at beginWork$1 (react-dom.development.js:23203)
    at performUnitOfWork (react-dom.development.js:22157)
    at workLoopSync (react-dom.development.js:22130)
    at performSyncWorkOnRoot (react-dom.development.js:21756)
    at scheduleUpdateOnFiber (react-dom.development.js:21188)
    at updateContainer (react-dom.development.js:24373)
    at react-dom.development.js:24758
    at unbatchedUpdates (react-dom.development.js:21903)
    at legacyRenderSubtreeIntoContainer (react-dom.development.js:24757)
    at render (react-dom.development.js:24840)
    at Module../src/index.js (index.js:7)
    at __webpack_require__ (bootstrap:784)
    at fn (bootstrap:150)
    at Object.1 (redux-index.js:36)
    at __webpack_require__ (bootstrap:784)
    at checkDeferredModules (bootstrap:45)
    at Array.webpackJsonpCallback [as push] (bootstrap:32)
    at main.chunk.js:1

const mapStateToProps = state => {
  return { articles: state.article.articles };
};