Reactjs 如何在React admin中设置React RRule Generator的默认值？

我正在使用react admin和react rrule generator（）。使用rrule小部件时，创建/添加记录工作正常。但是每当我试图编辑一条记录时，小部件应该根据记录的值自动填充其值。但该值始终是小部件本身提供的默认值。这是我的密码：

main_file.jsx

export const JobCreate = (props) => {
  return (
    <Create {...props}>
      <SimpleForm>
        <CustomRRuleInput name="recurrency" label="Recurrency" />
      </SimpleForm>
    </Create>
  )
}

import RRuleGenerator from "react-rrule-generator"
import React, { useState } from "react"
import { useInput, Labeled, TextInput } from "react-admin"
import { rrulestr } from "rrule"


export const CustomRRuleInput = (props) => {
  const record = props.record
  const {
    input: { onChange },
  } = useInput(props)

  const [state, setState] = useState(record[props.name])

  return (
    <>
      <Labeled label={props.label}>
        <RRuleGenerator
          onChange={(val) => {
            setState(val)
            onChange(val)
          }}
          value={state}
          name={props.name}
        />
      </Labeled>

      <TextInput
        fullWidth
        disabled
        label={"RRule Text"}
        value={state ? rrulestr(state).toText() : ""}
      />
    </>
  )
}

<CustomRRuleInput name="recurrency" label="Recurrency(r rule)" />

export const JobCreate=（道具）=>{
返回(
)
}

重现性_field.jsx

export const JobCreate = (props) => {
  return (
    <Create {...props}>
      <SimpleForm>
        <CustomRRuleInput name="recurrency" label="Recurrency" />
      </SimpleForm>
    </Create>
  )
}

import RRuleGenerator from "react-rrule-generator"
import React, { useState } from "react"
import { useInput, Labeled, TextInput } from "react-admin"
import { rrulestr } from "rrule"


export const CustomRRuleInput = (props) => {
  const record = props.record
  const {
    input: { onChange },
  } = useInput(props)

  const [state, setState] = useState(record[props.name])

  return (
    <>
      <Labeled label={props.label}>
        <RRuleGenerator
          onChange={(val) => {
            setState(val)
            onChange(val)
          }}
          value={state}
          name={props.name}
        />
      </Labeled>

      <TextInput
        fullWidth
        disabled
        label={"RRule Text"}
        value={state ? rrulestr(state).toText() : ""}
      />
    </>
  )
}

<CustomRRuleInput name="recurrency" label="Recurrency(r rule)" />

export const CustomRRuleInput=（道具）=>{
常数{
输入：{onChange}，
meta:{触摸，错误}，
}=使用输入（道具）
返回(
)
}

如果我在

RRuleGenerator

组件中添加

value={props.record.recurrency}

，我无法更改值，因为我固定了/硬编码了它的值，即使我尝试更改它们，它也是常量。如果这个小部件有一个名为

defaultValue

的道具，那么它就会成功！

---

如何实现这一点？

如果仔细检查文档的部分，您会注意到使用

useField

或

useInput

钩子的自定义输入组件仍然会收到

源
属性，该属性作为钩子参数的一部分在输入中传递

试试这个：

在main_file.jsx中

<CustomRRuleInput source="recurrency" label="Recurrency" />



内部重现性_field.jsx

const {
    input: { name, onChange },
    meta: { touched, error },
  } = useInput(props)

  return (
    <Labeled label={props.label}>
      <RRuleGenerator
        onChange={onChange}
        name={name}
      />
    </Labeled>
  )
  

const{
输入：{name，onChange}，
meta:{触摸，错误}，
}=使用输入（道具）
返回(
)
别管我做了！我可以用它来创建和更新记录。我还使用了rrule库将rrule转换为人类可读的文本，该文本显示在rrule小部件下方的TextInput字段中。当您在RRule小部件中更改数据时，文本会动态更改

重现性_field.jsx

export const JobCreate = (props) => {
  return (
    <Create {...props}>
      <SimpleForm>
        <CustomRRuleInput name="recurrency" label="Recurrency" />
      </SimpleForm>
    </Create>
  )
}

import RRuleGenerator from "react-rrule-generator"
import React, { useState } from "react"
import { useInput, Labeled, TextInput } from "react-admin"
import { rrulestr } from "rrule"


export const CustomRRuleInput = (props) => {
  const record = props.record
  const {
    input: { onChange },
  } = useInput(props)

  const [state, setState] = useState(record[props.name])

  return (
    <>
      <Labeled label={props.label}>
        <RRuleGenerator
          onChange={(val) => {
            setState(val)
            onChange(val)
          }}
          value={state}
          name={props.name}
        />
      </Labeled>

      <TextInput
        fullWidth
        disabled
        label={"RRule Text"}
        value={state ? rrulestr(state).toText() : ""}
      />
    </>
  )
}

<CustomRRuleInput name="recurrency" label="Recurrency(r rule)" />

从“react rrule generator”导入RRuleGenerator
从“React”导入React，{useState}
从“react admin”导入{useInput，已标记，TextInput}
从“rrule”导入{rrulestr}
导出常量CustomRRuleInput=（道具）=>{
const record=props.record
常数{
输入：{onChange}，
}=使用输入（道具）
const[state，setState]=useState（记录[props.name]）
返回(
{
设置状态（val）
onChange（val）
}}
值={state}
name={props.name}
/>
)
}

main_file.jsx

export const JobCreate = (props) => {
  return (
    <Create {...props}>
      <SimpleForm>
        <CustomRRuleInput name="recurrency" label="Recurrency" />
      </SimpleForm>
    </Create>
  )
}

import RRuleGenerator from "react-rrule-generator"
import React, { useState } from "react"
import { useInput, Labeled, TextInput } from "react-admin"
import { rrulestr } from "rrule"


export const CustomRRuleInput = (props) => {
  const record = props.record
  const {
    input: { onChange },
  } = useInput(props)

  const [state, setState] = useState(record[props.name])

  return (
    <>
      <Labeled label={props.label}>
        <RRuleGenerator
          onChange={(val) => {
            setState(val)
            onChange(val)
          }}
          value={state}
          name={props.name}
        />
      </Labeled>

      <TextInput
        fullWidth
        disabled
        label={"RRule Text"}
        value={state ? rrulestr(state).toText() : ""}
      />
    </>
  )
}

<CustomRRuleInput name="recurrency" label="Recurrency(r rule)" />

现在，即使是“创建”也不起作用。在main_file.jsx中传递
名称
而不是
源代码
成功。唯一的问题是，在编辑时，Rrule小部件没有显示该记录的先前值。但是使用
source
甚至不允许我创建或编辑记录。很抱歉，我把代码弄乱了。创建和编辑作品。但我仍然无法在RRule小部件中编辑记录时获取初始值！