我有一些麻烦,在浏览器上执行我的Visual Studio代码项目的时间。
错误。export 'default' (imported as 'Redux') was not found in 'react-redux' (possible exports: Provider, ReactReduxContext, batch, connect, createDispatchHook, createSelectorHook, createStoreHook, shallowEqual, useDispatch, useSelector, useStore)
我的代码是这样的。
src/index.js
import ReactDOM from "react-dom/client";
import Redux from "react-redux";
import Store from "./store/index";
import App from "./App";
import "./index.css";
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
<Redux.Provider store={Store}>
<App />
</Redux.Provider>
);
src/store/index.js
const initialState = { counter: 0, visible: true };
const counterReducer = (state = initialState, action) => {
switch (action.type) {
case "increment":
return {
counter: state.counter + 1,
visible: state.visible,
};
case "decrement":
return {
counter: state.counter - 1,
visible: state.visible,
};
case "switchVisibility":
return {
counter: state.counter,
visible: !state.visible,
};
default:
return state;
}
};
const store = Redux.createStore(counterReducer);
export default store;
src/components/counter.js
import style from "./Counter.module.css";
const Counter = () => {
const distpach = Redux.useDispatch();
const counter = Redux.useSelector((state) => state.counter);
const visibility = Redux.useSelector((state) => state.visibility);
const incrementHandler = () => {
distpach({ type: "increment" });
};
const decrementHandler = () => {
distpach({ type: "decrement" });
};
const toggleCounterHandler = () => {
distpach({ type: "switchVisibility" });};
return (
<main className={style["counter"]}>
<h1>Redux Counter</h1>
{visibility && <div className={style["value"]}>{counter}</div>}
<div>
<button onClick={incrementHandler}>Increment</button>
<button onClick={decrementHandler}>Decrement</button>
</div>
<button onClick={toggleCounterHandler}>Toggle Counter</button>
</main>
);
};
export default Counter;
Image with error
导出看起来是正确的,我不知道发生了什么。我想我在文件src/store/index.js中调用函数Redux.createStore的方式已经过时了,但这就是我错误的原因?
有人知道解决这个问题的方法吗?
2条答案
按热度按时间sqxo8psd1#
不要把
Redux from 'react-redux'
的导入弄得很复杂,实际上react-redux
不导出默认值,所以你不能直接导入。另一方面
react-redux
导出Provider
,useDispatch
,useSelector
等..所以你应该像这样导入直接使用这些
你可以理解你的例子代码在这你
export default store
注意,存储与小s
.和你使用存储与资本S
这里如果你删除了
default
关键字,那么你需要导入存储为j2qf4p5b2#
NAZIR HUSSAIN怎么说,我在如何申报进口和如何申报出口方面有一些问题。
下一个,为我工作!
src/index.js
和我的文件... src/store/index.js
非常感谢!