我正在尝试使用 react-sidenav
并脱离https://codesandbox.io/s/q9851xoymj来构建某些东西。
当我尝试使用withRR4()
函数如该示例中所做的时,加载页面时会出现以下错误。 Object(...) is not a function
及其发生在const SideNav = withRR4()
我正在使用"react-sidenav": "^3.1.3"
import React from 'react';
import { connect } from 'react-redux';
import { FaTasks, FaUserCog, FaProjectDiagram } from 'react-icons/fa';
import { IoIosBusiness } from 'react-icons/io';
import '../css/Nav.css';
import { withRR4, Nav } from 'react-sidenav';
import { Link } from "./styles";
import { getCompanies, getProjects, getTasks, getUsers } from '../actions';
const mapDispatchToProps = {
getCompanies: getCompanies,
getProjects: getProjects,
getTasks: getTasks,
getUsers: getUsers,
};
const SideNav = withRR4();
let CompanyLink=({getCompanies})=>(
<Link onClick={getCompanies}><IoIosBusiness /> Companies</Link>
)
CompanyLink = connect(null,mapDispatchToProps)(CompanyLink);
let ProjectLink=({getProjects})=>(
<Link onClick={getProjects}><FaProjectDiagram /> Projects</Link>
)
ProjectLink = connect(null,mapDispatchToProps)(ProjectLink);
let TaskLink=({getTasks})=>(
<Link onClick={getTasks}><FaTasks /> Tasks</Link>
)
TaskLink = connect(null,mapDispatchToProps)(TaskLink);
let UserLink=({getUsers})=>(
<Link onClick={getUsers}><FaUserCog /> Users</Link>
)
UserLink = connect(null,mapDispatchToProps)(UserLink);
const LeftNav = () => (
<SideNav defaultSelectedPath="company">
<Nav id="company"><CompanyLink /></Nav>
<Nav id="projects"><ProjectLink /></Nav>
<Nav id="tasks"><TaskLink /></Nav>
<Nav id="users"><UserLink /></Nav>
</SideNav>
)
export default LeftNav;
我不确定我在这里缺少什么。
尝试使用不同的版本:" react-sidenav":" 3.0.9"
如果您升级上面的版本,则示例也无法正常工作。
无需降级,尝试以下操作:
import { withRR4 } from "react-sidenav/withRR4";