打字稿说我用样式组件包装的组件上不存在道具

Question

I am using semantic-ui-react and along with styled-components. I am wrapping the Tab component with styled-components to customize its look. Here is that code

const CustomTab = styled(Tab)<{props: TabProps}>`
    flex: 1;
    display: flex;
    margin-top: 10px;
    flex-direction: column;
`;

As you can see I am trying to specify that the props for CustomTab will be the same props as the Tab component. I did this based on this answer.

The problem is that typescript still seems to think that Menu props does not exits on my CustomTab component.

Where am I going wrong?

Answer 1

Try const CustomTab = styled(Tab)<TabProps>

You basically defined your props as an object that looks like this: {props: {TabProps}}