Whenever I add a button on my reactstrap app, it says it "Cannot read properties of null (reading 'useCallback')".
I just started a new project, and I decided to use reactstrap this time. For some reason, it won't run a simple problem. I only have two file right now
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import ContextHeader from './ContextHeader.js';
import reportWebVitals from './reportWebVitals';
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode>
<ContextHeader />
</React.StrictMode>
);
reportWebVitals();
and
import { Button } from 'reactstrap';
import React, { useCallback } from 'react';
import './ContextHeader.css';
import ContextBody from './contextBody/ContextBody';
function ContextHeader() {
const handleClick = useCallback(() => {
console.log('Button clicked!');
}, []);
return (
<div>
<div className="ContextSelect">
<header className="ContextHeader">
<center>
<div className="ContextHeaderText">
Context Creator
</div>
</center>
</header>
<Button onClick={handleClick}>Click</Button>
<ContextBody/>
</div>
</div>
);
}
export default ContextHeader;
are the two files I'm running, and without the <Button onClick={handleClick}>Click</Button>
, the project runs. Any ideas? This isn't my first time using react, but my first time using reactstrap.
Found the problem. For some reason, reactstrap was installed on my computer, but wasn't being included in my node_modules folder. I just needed to add it to my package.json file