Skip to content

Commit c049920

Browse files
xiaoyatongxiaoyatong
committed
feat: 调整某些写法
1 parent 8cc6934 commit c049920

File tree

2 files changed

+69
-80
lines changed

2 files changed

+69
-80
lines changed

‎src/packages/address/elevatorRender.taro.tsx‎

Lines changed: 32 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -87,8 +87,6 @@ export const ElevatorRender: FunctionComponent<
8787
} = useConfig()
8888
const classPrefix = 'nut-address'
8989

90-
const [tabActiveIndex, setTabActiveIndex] = useState(0)
91-
const [innerOptions, setInnerOptions] = useState(outerOptions)
9290
const [value, setValue] = usePropsValue({
9391
value: outerValue,
9492
defaultValue: outerDefaultValue,
@@ -99,9 +97,12 @@ export const ElevatorRender: FunctionComponent<
9997
},
10098
})
10199

100+
const [innerOptions, setInnerOptions] = useState(outerOptions)
102101
const [innerValue, setInnerValue] = useState(value)
102+
const [elevatorOptions, setElevatorOptions] = useState<any>([])
103103
const [addressTip, setAddressTip] = useState(selectProvice)
104104
const [levelIndex, setLevelIndex] = useState(0)
105+
const [tabActiveIndex, setTabActiveIndex] = useState(0)
105106

106107
// 初始化数据，只格式化一次；动态数据todo
107108
const options = useMemo(() => {
@@ -114,8 +115,6 @@ export const ElevatorRender: FunctionComponent<
114115
return transformData(innerOptions)
115116
}, [innerOptions, optionKey, format])
116117

117-
const [elevatorOptions, setElevatorOptions] = useState(options)
118-
119118
useEffect(() => {
120119
setElevatorOptions(options)
121120
}, [options])
@@ -145,6 +144,8 @@ export const ElevatorRender: FunctionComponent<
145144
next.push({
146145
name: null,
147146
children: currentOptions,
147+
levels: -1,
148+
current: false,
148149
})
149150
}
150151
return next
@@ -154,9 +155,7 @@ export const ElevatorRender: FunctionComponent<
154155
value: outerVisible,
155156
defaultValue: undefined,
156157
onChange: (value) => {
157-
if (value === false) {
158-
onClose()
159-
}
158+
if (value === false) onClose()
160159
},
161160
})
162161

@@ -182,14 +181,14 @@ export const ElevatorRender: FunctionComponent<
182181
if (elevatorItem.name) {
183182
nextValue[levelIndex] = elevatorItem.name
184183
}
184+
setInnerValue(nextValue)
185185
if (elevatorItem.children?.length) {
186186
setElevatorOptions(elevatorItem.children)
187187
setLevelIndex(levelIndex + 1)
188188
} else {
189189
setVisible(false)
190190
setValue(nextValue)
191191
}
192-
setInnerValue(nextValue)
193192
}
194193

195194
const handleHotItemClick = (hotItem: any) => {
@@ -210,14 +209,13 @@ export const ElevatorRender: FunctionComponent<
210209
return (
211210
<View className={`${classPrefix}-selected`}>
212211
{levels.map((item, index) => (
213-
<>
212+
<React.Fragment key={`adtabs-${index}`}>
214213
{item.name && (
215214
<View
216215
className={`${classPrefix}-selected-item ${item.current ? 'active' : ''}`}
217-
key={`-${index}`}
218216
onClick={() => {
219-
props.onTabsChange?.(Number(index))
220-
setTabActiveIndex(Number(index))
217+
props.onTabsChange?.(index)
218+
setTabActiveIndex(index)
221219
setLevelIndex(index)
222220
setElevatorOptions(item.children)
223221
}}
@@ -228,14 +226,14 @@ export const ElevatorRender: FunctionComponent<
228226
{levels[index + 1]?.name && (
229227
<View className={`${classPrefix}-selected-border`}>-</View>
230228
)}
231-
</>
229+
</React.Fragment>
232230
))}
233231
</View>
234232
)
235233
}
236234

237235
const renderHotCity = () => {
238-
if (levels.length && tabActiveIndex !== 0) return
236+
if (levels.length && tabActiveIndex !== 0) return null
239237
return (
240238
<>
241239
<View className={`${classPrefix}-title`}>{hotCity}</View>
@@ -254,31 +252,27 @@ export const ElevatorRender: FunctionComponent<
254252
)
255253
}
256254

257-
const renderArea = () => {
258-
return (
259-
<>
260-
<View className={`${classPrefix}-title`}>{addressTip}</View>
261-
<Elevator
262-
className={`${classPrefix}-elevator`}
263-
list={elevatorOptions}
264-
onItemClick={(key: string, item: any) =>
265-
handleElevatorItemClick(item, levelIndex)
266-
}
267-
height="300px"
268-
/>
269-
</>
270-
)
271-
}
255+
const renderArea = () => (
256+
<>
257+
<View className={`${classPrefix}-title`}>{addressTip}</View>
258+
<Elevator
259+
className={`${classPrefix}-elevator`}
260+
list={elevatorOptions}
261+
onItemClick={(key: string, item: any) =>
262+
handleElevatorItemClick(item, levelIndex)
263+
}
264+
height="300px"
265+
/>
266+
</>
267+
)
272268

273-
const renderContent = () => {
274-
return (
275-
<>
276-
{renderTabs()}
277-
{renderHotCity()}
278-
{renderArea()}
279-
</>
280-
)
281-
}
269+
const renderContent = () => (
270+
<>
271+
{renderTabs()}
272+
{renderHotCity()}
273+
{renderArea()}
274+
</>
275+
)
282276

283277
return popup ? (
284278
<Popup

‎src/packages/address/elevatorRender.tsx‎

Lines changed: 37 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -105,24 +105,24 @@ export const ElevatorRender: FunctionComponent<
105105

106106
// 初始化数据，只格式化一次；动态数据todo
107107
const options = useMemo(() => {
108-
let currOptions = innerOptions
109108
if (!isEmpty(format)) {
110-
currOptions = normalizeListOptions(innerOptions, format)
111-
} else if (!isEmpty(optionKey)) {
112-
currOptions = normalizeOptions(innerOptions, optionKey) || []
109+
return transformData(normalizeListOptions(innerOptions, format))
113110
}
114-
return transformData(currOptions)
111+
if (!isEmpty(optionKey)) {
112+
return transformData(normalizeOptions(innerOptions, optionKey) || [])
113+
}
114+
return transformData(innerOptions)
115115
}, [innerOptions, optionKey, format])
116116

117117
useEffect(() => {
118118
setElevatorOptions(options)
119119
}, [options])
120120

121-
const levels: any[] = useMemo(() => {
121+
const levels = useMemo(() => {
122122
const next = []
123123
let end = false
124124
let currentOptions = options
125-
for (const [index, val] of innerValue.entries()) {
125+
innerValue.forEach((val, index) => {
126126
const opt = currentOptions
127127
?.flatMap((o: any) => o.list.find((item: any) => item.name === val))
128128
.filter((item) => item !== undefined)[0]
@@ -138,11 +138,13 @@ export const ElevatorRender: FunctionComponent<
138138
} else {
139139
end = true
140140
}
141-
}
141+
})
142142
if (!end) {
143143
next.push({
144144
name: null,
145145
children: currentOptions,
146+
levels: -1,
147+
current: false,
146148
})
147149
}
148150
return next
@@ -152,9 +154,7 @@ export const ElevatorRender: FunctionComponent<
152154
value: outerVisible,
153155
defaultValue: undefined,
154156
onChange: (value) => {
155-
if (value === false) {
156-
onClose()
157-
}
157+
if (value === false) onClose()
158158
},
159159
})
160160

@@ -180,14 +180,14 @@ export const ElevatorRender: FunctionComponent<
180180
if (elevatorItem.name) {
181181
nextValue[levelIndex] = elevatorItem.name
182182
}
183+
setInnerValue(nextValue)
183184
if (elevatorItem.children?.length) {
184185
setElevatorOptions(elevatorItem.children)
185186
setLevelIndex(levelIndex + 1)
186187
} else {
187188
setVisible(false)
188189
setValue(nextValue)
189190
}
190-
setInnerValue(nextValue)
191191
}
192192

193193
const handleHotItemClick = (hotItem: any) => {
@@ -208,14 +208,13 @@ export const ElevatorRender: FunctionComponent<
208208
return (
209209
<div className={`${classPrefix}-selected`}>
210210
{levels.map((item, index) => (
211-
<>
211+
<React.Fragment key={`adtabs-${index}`}>
212212
{item.name && (
213213
<div
214214
className={`${classPrefix}-selected-item ${item.current ? 'active' : ''}`}
215-
key={`-${index}`}
216215
onClick={() => {
217-
props.onTabsChange?.(Number(index))
218-
setTabActiveIndex(Number(index))
216+
props.onTabsChange?.(index)
217+
setTabActiveIndex(index)
219218
setLevelIndex(index)
220219
setElevatorOptions(item.children)
221220
}}
@@ -226,14 +225,14 @@ export const ElevatorRender: FunctionComponent<
226225
{levels[index + 1]?.name && (
227226
<div className={`${classPrefix}-selected-border`}>-</div>
228227
)}
229-
</>
228+
</React.Fragment>
230229
))}
231230
</div>
232231
)
233232
}
234233

235234
const renderHotCity = () => {
236-
if (levels.length && tabActiveIndex !== 0) return
235+
if (levels.length && tabActiveIndex !== 0) return null
237236
return (
238237
<>
239238
<div className={`${classPrefix}-title`}>{hotCity}</div>
@@ -252,31 +251,27 @@ export const ElevatorRender: FunctionComponent<
252251
)
253252
}
254253

255-
const renderArea = () => {
256-
return (
257-
<>
258-
<div className={`${classPrefix}-title`}>{addressTip}</div>
259-
<Elevator
260-
className={`${classPrefix}-elevator`}
261-
list={elevatorOptions}
262-
onItemClick={(key: string, item: any) =>
263-
handleElevatorItemClick(item, levelIndex)
264-
}
265-
height="300px"
266-
/>
267-
</>
268-
)
269-
}
254+
const renderArea = () => (
255+
<>
256+
<div className={`${classPrefix}-title`}>{addressTip}</div>
257+
<Elevator
258+
className={`${classPrefix}-elevator`}
259+
list={elevatorOptions}
260+
onItemClick={(key: string, item: any) =>
261+
handleElevatorItemClick(item, levelIndex)
262+
}
263+
height="300px"
264+
/>
265+
</>
266+
)
270267

271-
const renderContent = () => {
272-
return (
273-
<>
274-
{renderTabs()}
275-
{renderHotCity()}
276-
{renderArea()}
277-
</>
278-
)
279-
}
268+
const renderContent = () => (
269+
<>
270+
{renderTabs()}
271+
{renderHotCity()}
272+
{renderArea()}
273+
</>
274+
)
280275

281276
return popup ? (
282277
<Popup

0 commit comments

Comments
 (0)