fix: 修复选 InfluxDB 数据源时白屏
Form.useWatch('influx_version', form) 在 JSX 中内联调用,
违反 React hooks 规则(条件性调用 hooks),导致组件渲染时崩溃。
修复:将 watch 提到组件顶部,与 jobType 一起声明。
Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -116,6 +116,7 @@ export function JobForm({ mode }: { mode: 'create' | 'edit' }) {
|
|||||||
const [loading, setLoading] = useState(false)
|
const [loading, setLoading] = useState(false)
|
||||||
const [existing, setExisting] = useState<JobWithLastRun | null>(null)
|
const [existing, setExisting] = useState<JobWithLastRun | null>(null)
|
||||||
const jobType = Form.useWatch('type', form)
|
const jobType = Form.useWatch('type', form)
|
||||||
|
const influxVersion = Form.useWatch('influx_version', form)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
storageApi.list().then(setStorages)
|
storageApi.list().then(setStorages)
|
||||||
@@ -297,7 +298,7 @@ export function JobForm({ mode }: { mode: 'create' | 'edit' }) {
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Space.Compact>
|
</Space.Compact>
|
||||||
|
|
||||||
{Form.useWatch('influx_version', form) === '1' ? (
|
{influxVersion === '1' ? (
|
||||||
<>
|
<>
|
||||||
<Form.Item name="influx_database" label="数据库名" rules={[{ required: true }]}>
|
<Form.Item name="influx_database" label="数据库名" rules={[{ required: true }]}>
|
||||||
<Input placeholder="telegraf" />
|
<Input placeholder="telegraf" />
|
||||||
|
|||||||
Reference in New Issue
Block a user