Files
LingChair/client/ui/preference/TextFieldPreference.tsx
CrescentLeaf db43de19c4 fix: 配置组件没有正确同步状态
* 问题出在我应该根据 State 决定组件状态而不是组件状态决定 State
* 踩坑了, 浪费我时间, 唉
2025-10-08 12:24:33 +08:00

35 lines
1.0 KiB
TypeScript

import React from 'react'
import { prompt } from 'mdui'
import PreferenceUpdater from "./PreferenceUpdater.ts"
interface Args extends React.HTMLAttributes<HTMLElement> {
title: string
description?: string
icon: string
id: string
state: string
disabled?: boolean
}
export default function TextFieldPreference({ title, icon, description, id, state, disabled }: Args) {
const updater = React.useContext(PreferenceUpdater)
return <mdui-list-item icon={icon} rounded disabled={disabled ? true : undefined} onClick={() => {
prompt({
headline: title,
confirmText: "确定",
cancelText: "取消",
onConfirm: (value) => {
updater(id, value)
},
onCancel: () => {},
textFieldOptions: {
label: description,
value: state,
},
})
}}>
{title}
{description && <span slot="description">{description}</span>}
</mdui-list-item>
}