我的 React 应用程序中有一个动态水平列表,我想从一个动态呈现的导航栏导航到该列表。导航栏如下所示:
{catagories.length > 0 &&
catagories.map((catagory, id) => (
<Link horizontal={true} to={catagory} spy={true} smooth={true}>
<li
className={
activeCategory == catagory
? "navbar navbar__active"
: "navbar"
}
key={id}
onClick={() => this.setActiveCategory(catagory)}
>
<p className="navbar__item"> {catagory}</p>
</li>
</Link>
))}
和水平列表:
{catagories.length > 0 &&
allLists[catagories[0]] &&
catagories.map((catagory, id) => (
<Element name={catagory}>
<Listing
className="menulist-listing"
lists={Object.values(allLists[catagory])}
increaseCount={this.increaseCount}
decreaseCount={this.decreaseCount}
catagory={catagory}
name={catagory}
key={id}
mixClicked={mixClicked}
id={catagory}
/>
</Element>
))}
Listing
是一个自定义组件,它从道具呈现另一个垂直列表。我正在使用 react-scroll 包中的Link
和Element
组件。但这不起作用,并且不会按预期滚动到选定的列表。
任何帮助,将不胜感激。谢谢,