reactjs - 在“Connect(App)”的上下文中找不到“store”。- React npm 测试期间的错误消息
问题描述
首先,我想说这个类别中问题的其他答案都无法解决我的问题。在 npm 测试期间,我收到以下错误:
FAIL src/App.test.js × 渲染 App (74 ms)
● 渲染App
**Could not find "store" in the context of "Connect(App)". Either wrap the root component in a <Provider>, or pass a custom React context provider to <Provider> and the corresponding React context consumer to Connect(App) in connect options.**
6 | test('renders App', () => {
7 | const div = document.createElement('div');
8 | ReactDOM.render(, div); | ^ 9 | ReactDOM.unmountComponentAtNode(div); 10 | }); 11 |
这是测试代码:
import React from 'react';
import '@testing-library/jest-dom';
import App from './App';
import * as ReactDOM from "react-dom";
test('renders App', () => {
const div = document.createElement('div');
ReactDOM.render(<App />, div);
ReactDOM.unmountComponentAtNode(div);
});
这是 App.jsx(我也尝试使用扩展名 .js 但没有区别):
import React from 'react';
import './App.css';
import {Switch, Route, Redirect} from 'react-router-dom';
import Header from "./components/header/header.component";
import HomePage from "./components/homepage/homepage.component";
import Categories from "./components/categories/categories.component";
import Jokes from "./components/jokes/jokes.component";
import Search from "./components/search/search.component";
import SignIn from "./components/sign-in/sign-in.component";
import {connect} from "react-redux";
class App extends React.Component {
render() {
const {currentUser} = this.props;
return (
<div>
<Header/>
<Switch>
<Route exact path='/' render={() => <HomePage/>}/>
<Route path='/categories' render={() => <Categories/>}/>
<Route path='/jokes' render={() => <Jokes/>}/>
<Route path='/search' render={() => <Search/>}/>
<Route
exact
path='/sign-in'
render={() =>
currentUser
? <Redirect to='/'/>
: <SignIn/>}
/>
</Switch>
</div>
);
}
}
const mapStateToProps = state => ({
currentUser: state.user.currentUser
})
导出默认连接(mapStateToProps)(App);index.js 文件如下:
import React from 'react';
import './index.css';
import App from './App';
import {BrowserRouter} from "react-router-dom";
import {Provider} from "react-redux";
import store from "./redux/store";
import * as ReactDOM from "react-dom";
ReactDOM.render(
<Provider store={store}>
<BrowserRouter>
<React.StrictMode>
<App/>
</React.StrictMode>
</BrowserRouter>
</Provider>,
document.getElementById('root')
);
解决方案
推荐阅读
- javascript - 如何在 jQuery Accordions 中实现即时搜索
- matplotlib - 显示箱线图可视化的 pandas 数据框的分层绘图
- firebase - firebase 规则(集合的其余部分)
- facebook-graph-api - 是否可以获取页面帖子的作者姓名?
- python - 如何使用 usb2can 接口设置 Python canopen?
- node.js - IBM Cloud 与 Cloud Foundry:node-gzip 不压缩缓冲区
- android - 如何在 Android 9 Api 28 中使用 HttpsUrlConnection 写入远程服务器上的 .txt 文件
- sql - 通过取两行之间的差异计算的 Athena (Presto) 表中添加一个新列
- tensorflow - Keras如何预处理输入信号
- windows - 如果打印到 prn 文件,为什么会丢失扩展属性