为什么在使用带有样式组件的样式系统时，我看不到智能感知中的道具？

Question

所以，首先，我宣布我的组成部分如下：

import styled from 'styled-components';
import {
    space, color, layout, flexbox, border,
} from 'styled-system';

const FlexWrapper = styled.div`
    display: flex;
    gap: ${({ gap }) => gap || '10px'};
    ${layout};
    ${space};
    ${color};
    ${flexbox};
    ${border};
`;

export default FlexWrapper;

然后我就用它：

return (
        <FlexWrapper flexDirection='column' width={width}>
            <FlexWrapper flexDirection='row' gap='30px'>
                {filters}
            </FlexWrapper>
        </FlexWrapper>
    );

最终，道具可以正常工作，但是vscode intellisense根本看不到它。有什么办法可以解决这个问题吗？

Answer 1

我在代码编辑器和IDE中有这个问题，如果您不使用类型记录，我将它们单独放在一边，我强烈建议您使用类型记录来提高您的开发速度。

npx create-react-app --template typescript //  :)

如果有用的话请投赞成票