Skip to content

Commit cd9032a

Browse files
irisSongirisSong
committed
fix: cr 修改
1 parent 02f4881 commit cd9032a

File tree

11 files changed

+63
-56
lines changed

11 files changed

+63
-56
lines changed

‎src/packages/badge/badge.harmony.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@
55
/* #ifdef harmony */
66
min-width: 1px;
77
/* #endif */
8+
/* #ifndef harmony */
9+
min-width: auto;
10+
/* #endif */
811
}
912
.nut-badge-icon {
1013
position: absolute;

‎src/packages/badge/badge.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@
55
/* #ifdef harmony */
66
min-width: 1px;
77
/* #endif */
8+
/* #ifndef harmony */
9+
min-width: auto;
10+
/* #endif */
811
&-icon {
912
position: absolute;
1013
display: flex;

‎src/packages/badge/badge.taro.tsx‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ export const Badge: FunctionComponent<Partial<BadgeProps>> = (props) => {
5252
...props,
5353
}
5454
const classPrefix = 'nut-badge'
55+
const isHarmony = harmony()
5556
const classes = classNames(classPrefix, className)
5657
const badgeRef = useRef(null)
5758
const [contentStyle, setContentStyle] = useState({})
@@ -88,10 +89,10 @@ export const Badge: FunctionComponent<Partial<BadgeProps>> = (props) => {
8889
if (badgeRef.current) {
8990
getPositionStyle()
9091
}
91-
}, [badgeRef.current])
92+
}, [])
9293
const getPositionStyle = async () => {
9394
const style: CSSProperties = {}
94-
style.top = pxTransform(Number(-top) || 0)
95+
style.top = pxTransform(-Number(top) || 0)
9596
if (rn()) {
9697
const reacts = await getRectByTaro(badgeRef.current)
9798
style.left =
@@ -100,7 +101,7 @@ export const Badge: FunctionComponent<Partial<BadgeProps>> = (props) => {
100101
: 0
101102
} else {
102103
const dir = rtl ? 'left' : 'right'
103-
style[dir] = harmony()
104+
style[dir] = isHarmony
104105
? pxTransform(Number(right))
105106
: `${Number(right) || parseFloat(String(right)) || 0}px`
106107
}
@@ -112,13 +113,15 @@ export const Badge: FunctionComponent<Partial<BadgeProps>> = (props) => {
112113
if (color) {
113114
if (fill === 'outline') {
114115
style.color = color
115-
style.backgroundColor = '#fff'
116+
isHarmony
117+
? (style.backgroundColor = '#fff')
118+
: (style.background = '#fff')
116119
if (!color?.includes('gradient')) {
117120
style.borderColor = color
118121
}
119122
} else {
120123
style.color = '#fff'
121-
style.backgroundColor = color
124+
isHarmony ? (style.backgroundColor = color) : (style.background = color)
122125
}
123126
}
124127
return style

‎src/packages/badge/demos/taro/demo1.tsx‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,18 +17,21 @@ const Demo1 = () => {
1717
</>
1818
)
1919
}
20+
const marginStyles = isRnAndHarmony
21+
? { marginRight: pxTransform(40) }
22+
: { marginInlineEnd: '40px' }
2023
return (
2124
<Cell>
22-
<Badge style={{ marginRight: pxTransform(40) }} value={8}>
25+
<Badge style={marginStyles} value={8}>
2326
{renderChildren()}
2427
</Badge>
25-
<Badge style={{ marginRight: pxTransform(40) }} value={76}>
28+
<Badge style={marginStyles} value={76}>
2629
{renderChildren()}
2730
</Badge>
28-
<Badge style={{ marginRight: pxTransform(40) }} value="NEW">
31+
<Badge style={marginStyles} value="NEW">
2932
{renderChildren()}
3033
</Badge>
31-
<Badge style={{ marginRight: pxTransform(40) }} dot top="2" right="4">
34+
<Badge style={marginStyles} dot top="2" right="4">
3235
{renderChildren()}
3336
</Badge>
3437
</Cell>

‎src/packages/badge/demos/taro/demo2.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,18 @@ const Demo2 = () => {
1717
</>
1818
)
1919
}
20+
const marginStyles = isRnAndHarmony
21+
? { marginRight: pxTransform(40) }
22+
: { marginInlineEnd: '40px' }
2023
return (
2124
<Cell>
22-
<Badge style={{ marginRight: pxTransform(40) }} value={200} max={9}>
25+
<Badge style={marginStyles} value={200} max={9}>
2326
{renderChildren()}
2427
</Badge>
25-
<Badge style={{ marginRight: pxTransform(40) }} value={200} max={20}>
28+
<Badge style={marginStyles} value={200} max={20}>
2629
{renderChildren()}
2730
</Badge>
28-
<Badge style={{ marginRight: pxTransform(40) }} value={200} max={99}>
31+
<Badge style={marginStyles} value={200} max={99}>
2932
{renderChildren()}
3033
</Badge>
3134
</Cell>

‎src/packages/badge/demos/taro/demo3.tsx‎

Lines changed: 7 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -17,31 +17,22 @@ const Demo3 = () => {
1717
</>
1818
)
1919
}
20+
const marginStyles = isRnAndHarmony
21+
? { marginRight: pxTransform(40) }
22+
: { marginInlineEnd: '40px' }
2023
return (
2124
<Cell>
22-
<Badge
23-
style={{ marginRight: pxTransform(40) }}
24-
value={8}
25-
color="rgba(73,143,242,1)"
26-
>
25+
<Badge style={marginStyles} value={8} color="rgba(73,143,242,1)">
2726
{renderChildren()}
2827
</Badge>
29-
<Badge
30-
style={{ marginRight: pxTransform(40) }}
31-
value={76}
32-
color="rgba(73,143,242,1)"
33-
>
28+
<Badge style={marginStyles} value={76} color="rgba(73,143,242,1)">
3429
{renderChildren()}
3530
</Badge>
36-
<Badge
37-
style={{ marginRight: pxTransform(40) }}
38-
value="NEW"
39-
color="rgba(73,143,242,1)"
40-
>
31+
<Badge style={marginStyles} value="NEW" color="rgba(73,143,242,1)">
4132
{renderChildren()}
4233
</Badge>
4334
<Badge
44-
style={{ marginRight: pxTransform(40) }}
35+
style={marginStyles}
4536
top="2"
4637
right="4"
4738
dot

‎src/packages/badge/demos/taro/demo4.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,9 @@ const Demo4 = () => {
1818
</>
1919
)
2020
}
21-
21+
const marginStyles = isRnAndHarmony
22+
? { marginRight: pxTransform(40) }
23+
: { marginInlineEnd: '40px' }
2224
const renderIcon = () => {
2325
return (
2426
<>
@@ -32,7 +34,7 @@ const Demo4 = () => {
3234
}
3335
return (
3436
<Cell>
35-
<Badge style={{ marginRight: pxTransform(40) }} value={renderIcon()}>
37+
<Badge style={marginStyles} value={renderIcon()}>
3638
{renderChildren()}
3739
</Badge>
3840
{/* <Badge

‎src/packages/badge/demos/taro/demo5.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,16 +27,19 @@ const Demo5 = () => {
2727
</>
2828
)
2929
}
30+
const marginStyles = isRnAndHarmony
31+
? { marginRight: pxTransform(40) }
32+
: { marginInlineEnd: '40px' }
3033
return (
3134
<Cell>
3235
<ConfigProvider theme={customTheme}>
33-
<Badge style={{ marginRight: pxTransform(40) }} value="NEW">
36+
<Badge style={marginStyles} value="NEW">
3437
{renderChildren()}
3538
</Badge>
3639
</ConfigProvider>
3740

3841
<ConfigProvider theme={customTheme2}>
39-
<Badge style={{ marginRight: pxTransform(40) }} dot top="2">
42+
<Badge style={marginStyles} dot top="2">
4043
{renderChildren()}
4144
</Badge>
4245
</ConfigProvider>

‎src/packages/badge/demos/taro/demo6.tsx‎

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -17,25 +17,18 @@ const Demo6 = () => {
1717
</>
1818
)
1919
}
20+
const marginStyles = isRnAndHarmony
21+
? { marginRight: pxTransform(40) }
22+
: { marginInlineEnd: '40px' }
2023
return (
2124
<Cell>
22-
<Badge
23-
style={{ marginRight: pxTransform(40) }}
24-
value={8}
25-
top="3"
26-
right="5"
27-
>
25+
<Badge style={marginStyles} value={8} top="3" right="5">
2826
{renderChildren()}
2927
</Badge>
30-
<Badge
31-
style={{ marginRight: pxTransform(40) }}
32-
value={76}
33-
top="-3"
34-
right="10"
35-
>
28+
<Badge style={marginStyles} value={76} top="-3" right="10">
3629
{renderChildren()}
3730
</Badge>
38-
<Badge style={{ marginRight: pxTransform(40) }} value="NEW">
31+
<Badge style={marginStyles} value="NEW">
3932
{renderChildren()}
4033
</Badge>
4134
</Cell>

‎src/packages/badge/demos/taro/demo7.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
import React from 'react'
22
import { Badge, Cell } from '@nutui/nutui-react-taro'
33
import pxTransform from '@/utils/px-transform'
4+
import { harmonyAndRn } from '@/utils/platform-taro'
45

56
const Demo7 = () => {
7+
const isRnAndHarmony = harmonyAndRn()
8+
const marginStyles = isRnAndHarmony
9+
? { marginRight: pxTransform(40) }
10+
: { marginInlineEnd: '40px' }
611
return (
712
<Cell style={{ height: pxTransform(80) }}>
8-
<Badge style={{ marginRight: pxTransform(40) }} value={8} />
9-
<Badge style={{ marginRight: pxTransform(40) }} value={76} />
10-
<Badge style={{ marginRight: pxTransform(40) }} value="NEW" />
13+
<Badge style={marginStyles} value={8} />
14+
<Badge style={marginStyles} value={76} />
15+
<Badge style={marginStyles} value="NEW" />
1116
</Cell>
1217
)
1318
}

0 commit comments

Comments
 (0)