Ant Design의 Buttton 구성 요소의 문자열 사이에 수수께끼 같은 공간이 있다면 해결 방법

결론

그거 버그 아니야.규격.
적당한 프로포즈를 주어 해제할 수 있습니다.
https://ant.design/components/button/#FAQ

import { ConfigProvider } from 'antd'

<ConfigProvider autoInsertSpaceInButton={false}>
    {children}
</ConfigProvider>

참고 자료

Ant Design - GitHub
Ant Design Button - Github.dev

해설

코드를 쫓아가면서 간단하게 기록해 놨어요.
저의 경솔함을 용서해 주십시오.
연관 파일./components/button/button.tsx ./components/button/style/index.less

삽입할 플래그

아래 코드 부분을 보면children은 1개입니다. icon이 없고 경계선의 테두리 type이 지정한 경우'무엇'을 삽입한 로고가 진짜가 된 것 같습니다.

두 개의 한자를 확인하고 '무엇' 의 표지state를 진짜로 바꿉니다

방금 삽입한 로고와 두 한자의 정규 표현식 로고가 진짜인지 확인하려면 다른'무엇'로고의 React State를 진짜로 설정합니다.

class 보기Name

button용 className은 다음과 같습니다.
그렇군요. 아까 hasTwoCNChar 로고만 봐도 부족해요.

주제 밖의 말인데 hasTwoCNChar'has two Chinese character'의 생략인가요?

button용 스타일

./components/button/style/index.less 파일의 css를 보세요.
letter-spacing 해당되는 것 같아요.
이거 스페이스 아니죠?
말하자면 이번에는 css뿐만 아니라 문자열의 반각 공간도 넣었다.
이러면 이거 아닌 게 있을 거야.
https://developer.mozilla.org/ja/docs/Web/CSS/letter-spacing

button에게 맡긴 children의 kids를 보세요.

있다!이거spaceChildren() 수상해!
이름만 봐도 스페이스의 구토가 뚜렷하게 드러난다!

찾았다!스페이스 함수 삽입!

spaceChildren()에서 insertSpace()를 호출하고 이 반환 값을 반환합니다.
그게 이유입니까?

그럼 스페이스를 어떻게 꺼요?

지금까지의 코드만 읽으면 어쨌든 autoInsertSpace 할 수 있다면 false 오케이!
근데 넌도대체 어디false에서 할 수 있을까?

생략!<Config Provider의 auto Insert Space InButon proops를 가짜로 만들어라!

앤토스가 디자인한 버튼 구성 요소의 FAQ에 기록되어 있다니.
https://ant.design/components/button/#FAQ

상기 이후 코드를 추적하면ConfigContext의autoInsertSpaceInButton가 요구false되어 아래 링크에 도달했습니다.
props에는 보통 있습니다.
https://ant.design/components/config-provider/#API

import { ConfigProvider } from 'antd'

<ConfigProvider autoInsertSpaceInButton={false}>
    {children}
</ConfigProvider>

총결산

OSS 코드를 읽는 게 재미있어요!
다만, 그 다음에 "문서에 쓰여 있습니까!"그러므로 공식 문서를 진지하게 읽으세요!