我已经制作了一个自定义Button组件，该组件返回HTML button。现在，我正在Button的{​​{1}}内部使用此Link。问题在于它不能以这种方式工作。奇怪的是，如果我在next-routes内使用HTML button，则按钮可以正常工作。但是，两个按钮都以完全相同的方式在DOM中呈现。以下是代码：

Link

以下内容无效：

// Button.js

import React from "react";
import classnames from "classnames";

const Button = ({
    children,newClass = "",onClickHandler = () => { },isSubmitting = false,inlineBtn = true,disabled,primary,secondary,basic,notCentered = true,shaded,miniLoader,type = "button",isTransparent,fontClass = "",small
}) => {
    return (
        <React.Fragment>
            <button
                classname={classnames(
                    `${isTransparent ? 'btn-transparent' : 'btn'} ${fontClass} ${newClass}`,{
                        "btn-block": !inlineBtn,"col-mx-auto": !notCentered,"btn-primary": primary,"btn-secondary": secondary,"btn-basic": basic,shaded: shaded,loading: isSubmitting,"loading-sm": miniLoader,"btn-sm": small
                    }
                )}
                disabled={disabled}
                type={type}
                onClick={onClickHandler}
            >
                <span>{children}</span>
            </button>
        </React.Fragment>
    );
};

export { Button };

以下工作正常：

<Link route="/register/location">
  <Button basic small>
    Sign Up
  </Button>
</Link>