mirror of
https://ghfast.top/https://github.com/aeroxw/tick-stock-panel.git
synced 2026-09-12 15:34:16 +08:00
style(ListColumnCustomizer): 修正 ref 镜像注释 + extTables 空数组常量化
code review P3 反馈修正: 1) 注释原写"8个useCallback空依赖"不准确(addExtColumn依赖extColumnAlign), 改为"多数空依赖并注明例外"; 2) 注释原提"memo失效"但SortableActiveCol未memo, 改为"子组件无谓重渲染"; 3) extTables的`?? []`每次创建新空数组导致useMemo失效, 改用模块级EMPTY_EXT_TABLES常量。另: P3-4同类backdrop-blur排查StockPreviewDialog/TradeKlineModal均为居中弹窗(面板不透明覆盖中心, blur只影响边缘, K线不持续刷新), 影响远小于信息条抽屉, 不修改。
This commit is contained in:
@@ -61,6 +61,9 @@ function isNumericFieldType(ft?: string): boolean {
|
||||
return true
|
||||
}
|
||||
|
||||
/** 模块级空数组常量:extSchema 未加载时用,避免 `?? []` 每次创建新引用导致 useMemo 失效。 */
|
||||
const EMPTY_EXT_TABLES: readonly { id: string; label: string; mode: string; columns: { name: string; label: string; type: string }[] }[] = []
|
||||
|
||||
function SortableActiveCol({ col, onRemove, onConfig, configOpen, extTableLabel, extConfig, candleConfig: candlePanel, intradayConfig: intradayPanel, strategiesConfig, showStandaloneToggle, onToggleStandalone }: {
|
||||
col: ColumnConfig
|
||||
onRemove: (id: string) => void
|
||||
@@ -166,8 +169,9 @@ export function ListColumnCustomizer({
|
||||
})
|
||||
const backdrop = useDialogBackdrop(onClose)
|
||||
|
||||
// columns/onChange 用 ref 镜像,让下方 8 个 useCallback 空依赖,
|
||||
// 避免 columns 每次变更都重建 callback 导致 SortableActiveCol 等 memo 失效。
|
||||
// columns/onChange 用 ref 镜像,让下方多数 useCallback 空依赖(addExtColumn 例外,
|
||||
// 依赖 props.extColumnAlign)。callback 引用稳定后,columns 变更不再导致
|
||||
// SortableActiveCol 等子组件因 props 变化而无谓重渲染。
|
||||
const columnsRef = useRef(columns)
|
||||
columnsRef.current = columns
|
||||
const onChangeRef = useRef(onChange)
|
||||
@@ -320,7 +324,7 @@ export function ListColumnCustomizer({
|
||||
})
|
||||
}, [])
|
||||
|
||||
const extTables = extSchema.data?.items ?? []
|
||||
const extTables = extSchema.data?.items ?? EMPTY_EXT_TABLES
|
||||
const extTableLabelMap = useMemo(() => new Map(extTables.map(t => [t.id, t.label])), [extTables])
|
||||
|
||||
const query = searchQuery.trim().toLowerCase()
|
||||
|
||||
Reference in New Issue
Block a user