Fatal编程技术网
  • reactjs/
  • Reactjs 无法将分解的道具分配给react引导组件

Reactjs 无法将分解的道具分配给react引导组件

reactjs typescript

Reactjs 无法将分解的道具分配给react引导组件,reactjs,typescript,react-bootstrap,Reactjs,Typescript,React Bootstrap,我已经安装并希望为我的项目自定义默认按钮，这样我就可以简单地编写，而无需为大多数按钮提供任何变体选项 import * as bs from "react-bootstrap"; export const Button: bs.Button = ({ variant = "outline-secondary", ...props }) => { return <bs.Button variant={variant} {...pro

我已经安装并希望为我的项目自定义默认按钮，这样我就可以简单地编写
，而无需为大多数按钮提供任何
变体
选项

import * as bs from "react-bootstrap";

export const Button: bs.Button = ({
  variant = "outline-secondary",
  ...props
}) => {
  return <bs.Button variant={variant} {...props} />;
};

import*作为“react bootstrap”中的bs；
导出常量按钮：bs.按钮=({
variant=“大纲二级”，
…道具
}) => {
返回；
};
这将导致以下错误

/path/to/MyComponent.tsx（11,11）中的类型脚本错误：
类型“{variant:string；}&Pick”不可分配给类型“intrinsiattributes&Pick&BsPrefixProps&buttonrops&{…；}”。
类型“{variant:string；}&Pick”不能分配给类型“Pick”。TS2322

如果我不破坏结构就写的话，效果会很好

export const Button: bs.Button = (props) => {
  return (
    <bs.Button {...props} variant={props.variant || "outline-secondary"} />
  );
};
导出常量按钮：bs.Button=（道具）=>{ 返回( ); }; 为什么第一个不起作用？从
道具中掉落了什么

更新

版本：TypeScript 4.0.2、React 16.13.1、React引导程序1.3.0

您的代码不起作用，因为您没有声明道具的类型，所以您只需要执行以下操作：


const按钮nx:bs.按钮=({
variant=“大纲二级”，
…道具
//这里的秘密-一套道具作为引导按钮类型
}：bs.按钮操作）=>{
返回；
};

当您以这种方式传播时，您的
…道具将出现
Pick@tmhao2005你说得对。我通常不想说某些东西不是我的错误，而是工具的错误，但是，您的评论确实有意义，因为TS从原始参数推断出复杂类型
React.PropsWithChildren
，而不进行分解