如何解决无法使用挂钩通过导入React组件进行映射
我是新来的人,所以这可能是一个菜鸟问题。 我试图创建一个侧栏,仅根据是否设置了变量显示链接。
但是首先,我只是试图创建一个useState挂钩,该挂钩是导入组件的数组,并使用一些虚拟数据在它们之间进行映射。
问题在于,当试图通过它们映射时,它总是告诉我该组件是不确定的。
error:TypeError:无法读取未定义的属性'SideBarLink'
我在做什么错? 另外,如果有更好的方法来做我想让lmk满意的事情。
SideBar.jsx -------------------------------------------- ----------
]
import React,{ useState } from 'react';
import SideBarLink from 'react';
const SideBar = () => {
const [sidelinks,setSideLinks] = useState( SideBarLink[
{
id: 1,name: 'Projects',displayLink: true
},{
id: 2,name: 'Tickets',displayLink: true
}
]);
const handleClick =() =>
{
console.log(sidelinks);
}
let slinks = (
<div>
<button onClick={handleClick}>button</button>
<div className="w3-sidebar w3-bar-block" >
{
sidelinks.SideBarLink.map((SideBarLink,index) =>
{
return <SideBarLink />
})
}
</div>
</div>
);
return slinks;
}
export default SideBar;
SideBarLink.jsx -------------------------------------
import React from 'react';
const SideBarLink = ( props ) => {
return (
<a href="#" className="w3-bar-item w3-button">{props.name}</a>
)
};
export default SideBarLink;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。