关于React中样式化组件中缺少属性的Typescript错误

我一直在遇到有关缺少属性的错误,特别是以下内容:

键入'{children:Element;键:数字; classname:字符串; onClick:()=>无效; }”缺少类型“ Pick,HTMLDivElement>

中的以下属性

而且我似乎无法弄清楚如何理解这个问题。

我已经尝试过将所有这些{children:Element;键:数字; classname:字符串; onClick:()=>无效; },但无济于事。

import React from 'react';
import styled from 'styled-components';

interface BoxProps {
    width?: string;
    height?: string;
    num: number;
    chosen: number;
    title: string;
    value: string;
    classname: string;
    key: number;
    showaccordion: (num: number) => void;
    onClick: (e: any) => void;
    children?: React.ReactNode;
}

const BoxContainer = styled.div<BoxProps>`
display: flex;
margin: 1em;
justify-content: center;
align-items: center;
width: ${p => p.width === p.width ? p.width : '8em'}
height: ${p => p.height === p.height ? p.height : '8em'};
padding: 10px;
box-shadow: 5px 8px 5px #888888;
border-radius: 5px;
color: white;
cursor: pointer;
font-weight: bold;
    &.large {
        -moz-transform: scale(1.2);
        -webkit-transform: scale(1.2);
        -o-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
    }
    &:nth-child(odd) {
        background: #00b2e3;
      }

    &:nth-child(even) {
        background: #44546A;
      }
    &:hover {
        -moz-transform: scale(1.2);
        -webkit-transform: scale(1.2);
        -o-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
        -webkit-transition: transform 0.3s ease-in-out;
        -moz-transition:transform 0.3s ease-in-out;
        -ms-transition:transform 0.3s ease-in-out;
    }
`;

const ItemText = styled.p`
margin: 0px 10px 0px 10px;
font-family: 'Agenda',san-serif;
font-size: 1.3em;
text-align: center;
`;

const Box: React.FC<BoxProps & { classname: string }> = ({ 
                                            width,height,num,chosen,title,showaccordion,...props
                                        }) => {



    return (
        <BoxContainer key={num} 
            classname={chosen === num ? 'large' : ''}
            onClick={() => showaccordion(num)}>
            <ItemText>{title}</ItemText></BoxContainer>
    )
}

export default Box;

错误消息是:键入'{children:Element;键:数字; classname:字符串; onClick:()=>无效; }”缺少类型“ Pick,HTMLDivElement>

中的以下属性
QQ5211982511 回答:关于React中样式化组件中缺少属性的Typescript错误

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3128747.html

大家都在问