Skip to content

Commit d63f8d8

Browse files
authored
fix(radio): lint fixed (#2635)
1 parent d623224 commit d63f8d8

File tree

4 files changed

+68
-110
lines changed

4 files changed

+68
-110
lines changed

src/packages/radio/radio.taro.tsx

Lines changed: 24 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,6 @@ export const Radio: FunctionComponent<
3737
Partial<RadioProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>
3838
> & { Group: typeof RadioGroup } = (props) => {
3939
const classPrefix = 'nut-radio'
40-
4140
const {
4241
children,
4342
className,
@@ -80,30 +79,6 @@ export const Radio: FunctionComponent<
8079
}
8180
}
8281
}
83-
84-
const renderLabel = () => {
85-
return (
86-
<div
87-
className={classNames(`${classPrefix}-label`, {
88-
[`${classPrefix}-label-disabled`]: disabled,
89-
})}
90-
>
91-
{children}
92-
</div>
93-
)
94-
}
95-
const renderButton = () => {
96-
return (
97-
<div
98-
className={classNames(`${classPrefix}-button`, {
99-
[`${classPrefix}-button-active`]: checkedStatement,
100-
[`${classPrefix}-button-disabled`]: disabled,
101-
})}
102-
>
103-
{children}
104-
</div>
105-
)
106-
}
10782
const color = () => {
10883
return {
10984
[`${classPrefix}-icon-disabled`]: disabled,
@@ -116,7 +91,6 @@ export const Radio: FunctionComponent<
11691
if (disabled && !checkedStatement) {
11792
return <CheckDisabled className={classNames(color())} />
11893
}
119-
12094
if (checkedStatement) {
12195
return React.isValidElement(activeIcon) ? (
12296
React.cloneElement<any>(activeIcon, {
@@ -136,37 +110,43 @@ export const Radio: FunctionComponent<
136110
<CheckNormal className={classNames(color())} />
137111
)
138112
}
139-
const renderByShape = (shape: RadioShape) => {
140-
return shape === 'button' ? (
141-
renderButton()
142-
) : (
113+
const renderLabel = () => {
114+
const labelcls = classNames(`${classPrefix}-label`, {
115+
[`${classPrefix}-label-disabled`]: disabled,
116+
})
117+
return (
143118
<>
144119
{renderIcon()}
145-
{renderLabel()}
120+
<div className={labelcls}>{children}</div>
146121
</>
147122
)
148123
}
124+
const renderButton = () => {
125+
const buttoncls = classNames(`${classPrefix}-button`, {
126+
[`${classPrefix}-button-active`]: checkedStatement,
127+
[`${classPrefix}-button-disabled`]: disabled,
128+
})
129+
return <div className={buttoncls}>{children}</div>
130+
}
131+
const renderByShape = (shape: RadioShape) => {
132+
return shape === 'button' ? renderButton() : renderLabel()
133+
}
149134
const renderRadioItem = () => {
150135
return renderByShape(context && context.shape ? context.shape : shape)
151136
}
152137
const handleClick: MouseEventHandler<HTMLDivElement> = (e) => {
153138
if (disabled || checkedStatement) return
154139
setCheckedStatement(!checkedStatement)
155140
}
156-
141+
const cls = classNames(
142+
classPrefix,
143+
{
144+
[`${classPrefix}-reverse`]: labelPosition === 'left',
145+
},
146+
className
147+
)
157148
return (
158-
<div
159-
className={classNames(
160-
classPrefix,
161-
{
162-
[`${classPrefix}-reverse`]: labelPosition === 'left',
163-
},
164-
className
165-
)}
166-
style={style}
167-
onClick={handleClick}
168-
{...rest}
169-
>
149+
<div className={cls} style={style} onClick={handleClick} {...rest}>
170150
{renderRadioItem()}
171151
</div>
172152
)

src/packages/radio/radio.tsx

Lines changed: 24 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,6 @@ export const Radio: FunctionComponent<
3333
Partial<RadioProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>
3434
> & { Group: typeof RadioGroup } = (props) => {
3535
const classPrefix = 'nut-radio'
36-
3736
const {
3837
children,
3938
className,
@@ -76,30 +75,6 @@ export const Radio: FunctionComponent<
7675
}
7776
}
7877
}
79-
80-
const renderLabel = () => {
81-
return (
82-
<div
83-
className={classNames(`${classPrefix}-label`, {
84-
[`${classPrefix}-label-disabled`]: disabled,
85-
})}
86-
>
87-
{children}
88-
</div>
89-
)
90-
}
91-
const renderButton = () => {
92-
return (
93-
<div
94-
className={classNames(`${classPrefix}-button`, {
95-
[`${classPrefix}-button-active`]: checkedStatement,
96-
[`${classPrefix}-button-disabled`]: disabled,
97-
})}
98-
>
99-
{children}
100-
</div>
101-
)
102-
}
10378
const color = () => {
10479
return {
10580
[`${classPrefix}-icon-disabled`]: disabled,
@@ -112,7 +87,6 @@ export const Radio: FunctionComponent<
11287
if (disabled && !checkedStatement) {
11388
return <CheckDisabled className={classNames(color())} />
11489
}
115-
11690
if (checkedStatement) {
11791
return React.isValidElement(activeIcon) ? (
11892
React.cloneElement<any>(activeIcon, {
@@ -132,37 +106,43 @@ export const Radio: FunctionComponent<
132106
<CheckNormal className={classNames(color())} />
133107
)
134108
}
135-
const renderByShape = (shape: RadioShape) => {
136-
return shape === 'button' ? (
137-
renderButton()
138-
) : (
109+
const renderLabel = () => {
110+
const labelcls = classNames(`${classPrefix}-label`, {
111+
[`${classPrefix}-label-disabled`]: disabled,
112+
})
113+
return (
139114
<>
140115
{renderIcon()}
141-
{renderLabel()}
116+
<div className={labelcls}>{children}</div>
142117
</>
143118
)
144119
}
120+
const renderButton = () => {
121+
const buttoncls = classNames(`${classPrefix}-button`, {
122+
[`${classPrefix}-button-active`]: checkedStatement,
123+
[`${classPrefix}-button-disabled`]: disabled,
124+
})
125+
return <div className={buttoncls}>{children}</div>
126+
}
127+
const renderByShape = (shape: RadioShape) => {
128+
return shape === 'button' ? renderButton() : renderLabel()
129+
}
145130
const renderRadioItem = () => {
146131
return renderByShape(context && context.shape ? context.shape : shape)
147132
}
148133
const handleClick: MouseEventHandler<HTMLDivElement> = (e) => {
149134
if (disabled || checkedStatement) return
150135
setCheckedStatement(!checkedStatement)
151136
}
152-
137+
const cls = classNames(
138+
classPrefix,
139+
{
140+
[`${classPrefix}-reverse`]: labelPosition === 'left',
141+
},
142+
className
143+
)
153144
return (
154-
<div
155-
className={classNames(
156-
classPrefix,
157-
{
158-
[`${classPrefix}-reverse`]: labelPosition === 'left',
159-
},
160-
className
161-
)}
162-
style={style}
163-
onClick={handleClick}
164-
{...rest}
165-
>
145+
<div className={cls} style={style} onClick={handleClick} {...rest}>
166146
{renderRadioItem()}
167147
</div>
168148
)

src/packages/radiogroup/radiogroup.taro.tsx

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,14 @@ export const RadioGroup = React.forwardRef(
5050
...rest
5151
} = { ...defaultProps, ...props }
5252

53+
const cls = classNames(
54+
classPrefix,
55+
{
56+
[`${classPrefix}-${props.direction}`]: props.direction,
57+
},
58+
className
59+
)
60+
5361
const [val2State, setVal2State] = usePropsValue<string | number>({
5462
defaultValue: props.defaultValue,
5563
value: props.value,
@@ -72,7 +80,7 @@ export const RadioGroup = React.forwardRef(
7280
/>
7381
)
7482
})
75-
}, [options])
83+
}, [options, labelPosition, val2State])
7684

7785
return (
7886
<RadioContext.Provider
@@ -89,16 +97,7 @@ export const RadioGroup = React.forwardRef(
8997
},
9098
}}
9199
>
92-
<div
93-
className={classNames(
94-
classPrefix,
95-
{
96-
[`${classPrefix}-${props.direction}`]: props.direction,
97-
},
98-
className
99-
)}
100-
{...rest}
101-
>
100+
<div className={cls} {...rest}>
102101
{options?.length ? renderOptionsChildren() : children}
103102
</div>
104103
</RadioContext.Provider>

src/packages/radiogroup/radiogroup.tsx

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,14 @@ export const RadioGroup = React.forwardRef(
5050
...rest
5151
} = { ...defaultProps, ...props }
5252

53+
const cls = classNames(
54+
classPrefix,
55+
{
56+
[`${classPrefix}-${props.direction}`]: props.direction,
57+
},
58+
className
59+
)
60+
5361
const [val2State, setVal2State] = usePropsValue<string | number>({
5462
defaultValue: props.defaultValue,
5563
value: props.value,
@@ -72,7 +80,7 @@ export const RadioGroup = React.forwardRef(
7280
/>
7381
)
7482
})
75-
}, [options])
83+
}, [options, labelPosition, val2State])
7684

7785
return (
7886
<RadioContext.Provider
@@ -89,16 +97,7 @@ export const RadioGroup = React.forwardRef(
8997
},
9098
}}
9199
>
92-
<div
93-
className={classNames(
94-
classPrefix,
95-
{
96-
[`${classPrefix}-${props.direction}`]: props.direction,
97-
},
98-
className
99-
)}
100-
{...rest}
101-
>
100+
<div className={cls} {...rest}>
102101
{options?.length ? renderOptionsChildren() : children}
103102
</div>
104103
</RadioContext.Provider>

0 commit comments

Comments
 (0)