Reactjs 链接组件顶部的按钮

嘿，我有一个被链接组件包装的div，在这个div中我有更多的按钮，但问题是，当我点击内部较小的按钮时，我实际上也点击了链接组件，所以我得到了重定向，这不是我想要的。。。我该如何解决这个问题？我试着用zIndex，但没用。。这是组件

<div className="post-container">
            <Link to="/test" style={{ textDecoration: "none" }}>
                <div className="link-post-container">
                    <div className="post-content">{post.title}</div>
                    <div className="post-bottom-bar">
                        <div className="bottom-bar-container-padded">
                            <div className="bottom-bar-container" onClick={test.bind(this)}>
                                <div>Comments</div>
                            </div>
                        </div>
                    </div>
                </div>
            </Link>
        </div>

{post.title}
评论

Hi@randomboigy在这里，我假设您的问题在类

的
div
和
链接
组件之间，对吗？您能为单击
div
时调用的
test
方法添加代码吗？@mgarcia是的，准确地说，
test
方法就是
console.log（“clicked”）
，因此当我单击.bottom bar容器时，它会打印“clicked”，但它也会将我重定向到/test，我只希望它打印“点击“，如果您不希望单击
div
触发重定向，为什么要将其放在
链接
元素中？这是一个无效的HTML链接，是锚标记的包装。将任何可点击的内容包装在锚定标记中是不好的practice@mgarcia因为我希望整个div都是可点击的，然后我想在div里面做一些小按钮，做一些其他的事情