fix: add space children

This commit is contained in:
zhuzhengjian 2023-04-17 10:55:29 +08:00
parent 63ac0cb613
commit 2208af0174
2 changed files with 25 additions and 4 deletions

View File

@ -1,6 +1,7 @@
// import type { VNode, VNodeChild } from 'vue' // import type { VNode, VNodeChild } from 'vue'
// import { isString } from '@v-c/utils' // import { isString } from '@v-c/utils'
// import { cloneVNode } from 'vue' import { Text } from 'vue'
import type { VNode } from 'vue'
const rxTwoCNChar = /^[\u4E00-\u9FA5]{2}$/ const rxTwoCNChar = /^[\u4E00-\u9FA5]{2}$/
export const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar) export const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar)
@ -8,6 +9,18 @@ export const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar)
export function isUnBorderedButtonType(type?: ButtonType) { export function isUnBorderedButtonType(type?: ButtonType) {
return type === 'text' || type === 'link' return type === 'text' || type === 'link'
} }
export const spaceChildren = (child: VNode, needInserted: boolean) => {
const SPACE = needInserted ? ' ' : ''
if (child.type === Text) {
let text = (child.children as string).trim()
if (isTwoCNChar(text)) {
text = text.split('').join(SPACE)
}
return <span>{text}</span>
}
return child
}
// //
// function splitCNCharsBySpace(child: VNodeChild , needInserted: boolean) { // function splitCNCharsBySpace(child: VNodeChild , needInserted: boolean) {
// if (child === null || child === undefined) { // if (child === null || child === undefined) {

View File

@ -16,7 +16,11 @@ import { useCompactItemContext } from '../space/compact'
import useStyle from './style' import useStyle from './style'
import type { ButtonProps, LoadingConfigType } from './interface' import type { ButtonProps, LoadingConfigType } from './interface'
import { buttonProps } from './interface' import { buttonProps } from './interface'
import { isTwoCNChar, isUnBorderedButtonType } from './button-helper' import {
isTwoCNChar,
isUnBorderedButtonType,
spaceChildren
} from './button-helper'
type Loading = number | boolean type Loading = number | boolean
function getLoadingConfig(loading: ButtonProps['loading']): LoadingConfigType { function getLoadingConfig(loading: ButtonProps['loading']): LoadingConfigType {
@ -181,6 +185,10 @@ const Button = defineComponent({
) )
const iconNode = icon && (!innerLoading.value ? icon?.() : <>L</>) const iconNode = icon && (!innerLoading.value ? icon?.() : <>L</>)
const kids =
children || children === 0
? spaceChildren(children[0] as any, isNeedInserted && autoInsertSpace)
: undefined
if (attrs.href !== undefined) { if (attrs.href !== undefined) {
return wrapSSR( return wrapSSR(
<a <a
@ -191,7 +199,7 @@ const Button = defineComponent({
ref={buttonRef} ref={buttonRef}
> >
{iconNode} {iconNode}
{children} {kids}
</a> </a>
) )
} }
@ -203,7 +211,7 @@ const Button = defineComponent({
ref={buttonRef} ref={buttonRef}
> >
{iconNode} {iconNode}
{children} {kids}
</button> </button>
) )