如何使用 React Admin 从 TextInput 字段中的 React Rrule 生成器获取 onChange() 值答案

【问题标题】：How to get the onChange() value from React Rrule Generator in TextInput field using React Admin如何使用 React Admin 从 TextInput 字段中的 React Rrule 生成器获取 onChange() 值
【发布时间】：2020-02-06 01:02:07
【问题描述】：

我可以知道如何使用 React Admin 从 TextInput 字段中的 React Rrule Generator 获取 onChange() 值。

代码：

输出示例：

用户选择时返回的“重复次数”值：

<RRuleGenerator
  onChange={(recurrences) => console.log(`${recurrences}`)}
  config={{
    repeat: ['Monthly', 'Weekly'],
    yearly: 'on the',
    monthly: 'on',
    end: ['Never', 'On date'],
    weekStartsOnSunday: true,
    hideError: true,
   }}
  />
  <TextInput label="Recurrences" source="recurrences" />

我使用的 react-rrule-generator：https://github.com/fafruch/react-rrule-generator

修改后的代码：

export const RACXICreate = (props) => {
const [state, setState] = useState('')
return (<Fragment>
        <RRuleGenerator
        onChange={(rrule) => setState({ rrule })}
         value={state.rrule}
         config={{
         repeat: ['Monthly', 'Weekly'],
         yearly: 'on the',
         monthly: 'on',
         end: ['Never', 'On date'],
         weekStartsOnSunday: true,
         hideError: true,
        }}
       />
       <TextInput label="Recurrences" source="recurrences" value={state.rrule} />
     </Fragment>)}

但如果我使用这段代码，我就能得到值：

<input type="text" source="recurrences" label="Recurrences" value={state.rrule} />

但我最想得到 TextInput 字段中的值。

【问题讨论】：

标签： reactjs recurrence react-admin rrule

【解决方案1】：

const React, { useState, Fragment } from 'react'

  const x = () => {
    const [state, setState] = useEffect('')
    return (
      <Fragment>
        <RRuleGenerator
          onChange={val => setState(val)}
          config={{
            repeat: ['Monthly', 'Weekly'],
            yearly: 'on the',
            monthly: 'on',
            end: ['Never', 'On date'],
            weekStartsOnSunday: true,
            hideError: true,
          }}
        />
        <TextInput label="Recurrences" source="recurrences" value={state} />
      </Fragment>
    )
  }

使用这样的状态对象

【讨论】：

我尝试使用您的代码，但它给了我错误：错误：无效的挂钩调用。钩子只能在函数组件的主体内部调用。这可能是由于以下原因之一： 1. 你可能有不匹配的 React 版本和渲染器（例如 React DOM） 2. 你可能违反了 Hooks 规则 3. 你可能有多个 React 副本同一个应用程序。我在 export const Create = props => ( ... ) 中使用它
你试图在一个类中使用它，要在一个类中使用你需要使用 this.setState() 而不是一个钩子状态对象
你能举个例子吗？谢谢你。但我使用 react admin 来做。
我建议先学习 react 是如何工作的，这是一个类与函数的例子medium.com/@Zwenza/…
您好，先生，我已将代码修改为如上所示的新代码，但当用户选择重复时，我仍然无法从 onChange 值中获取值。