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

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 上遇到了这个问题，我不理会它们如果您不使用 Typescript，我强烈建议您使用 Typescript 来提高开发速度。

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

如果有用请投票