首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何从Create form中的另一个组件更改Admin on Rest中的输入值?

在Admin on Rest中,可以通过使用<FormDataConsumer>组件来从Create表单中的另一个组件更改输入值。

<FormDataConsumer>组件是Admin on Rest提供的一个高阶组件,用于访问表单数据并在表单中进行操作。它接受一个函数作为子组件,并将当前表单数据作为参数传递给该函数。

要从Create表单中的另一个组件更改输入值,可以在该组件内部使用<FormDataConsumer>组件,并在其子组件函数中进行相应的操作。以下是一个示例:

代码语言:txt
复制
import React from 'react';
import { Create, TextInput, FormDataConsumer } from 'react-admin';

const MyCustomComponent = () => (
    <FormDataConsumer>
        {({ formData, ...rest }) => (
            <TextInput
                source="myInput"
                label="My Input"
                value={formData.anotherInput}
                onChange={(event) => {
                    // 在这里可以根据需要更改输入值
                    rest.updateFormData({ ...formData, myInput: event.target.value });
                }}
            />
        )}
    </FormDataConsumer>
);

const MyCreate = (props) => (
    <Create {...props}>
        <MyCustomComponent />
    </Create>
);

export default MyCreate;

在上面的示例中,MyCustomComponent是一个自定义的组件,它使用<FormDataConsumer>来访问表单数据。通过formData参数,我们可以获取到Create表单中的所有输入值。在TextInput组件中,我们将formData.anotherInput作为value属性的值,这样可以将另一个输入组件的值赋给当前组件的输入值。

onChange事件处理程序中,我们可以根据需要更改输入值。在这个例子中,我们使用rest.updateFormData方法来更新表单数据,并将新的输入值传递给myInput字段。

通过这种方式,我们可以从Create表单中的另一个组件更改Admin on Rest中的输入值。请注意,这只是一个示例,你可以根据实际需求进行相应的修改和调整。

关于Admin on Rest的更多信息和使用方法,你可以参考腾讯云的产品文档:Admin on Rest产品介绍

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

实用:如何将aoppointcut配置文件读取

背景 改造老项目,须要加一个aop来拦截所web Controller请求做一些处理,由于老项目比较多,且包命名也不统一,又不想每个项目都copy一份相同代码,这样会导致后以后升级很麻烦,不利于维护...我们都知道,java注解里面的都是一个常量, 如: @Pointcut("execution(* com.demo.Serviceable+.*(..))")...这种方式原则上是没有办法可以进行改变。但是我们又要实现这将aop切面值做成一个动态配置,每个项目的都不一样,该怎么办呢?...advisor.setAdvice(new LogAdvice ()); return advisor; } } 这里面的 pointcut.property来自于你...比如,我们定时器采用注解方式配置时候,cron表达式也是注解里面的一个字符串常量,那么,我们能不能通过配置文件方式来配置这个cron呢?原理都是一样

23.8K41
  • 解决iview weappi-input组件在微信开发者工具不能输入问题

    记录下i-input组件在模拟器不能输入问题原因及解决办法 最近开始用mpvue框架,所以遇到了一些坑,这篇文章记录下关于input组件一个坑。老司机请略过。...于是乎进行了一番搜索,发现有同学遇到了同样情况 ⬇️ iview weapp 在小程序开发工具i-input组件不能输入 看了下自己登录页,果然是没加maxlength属性 <template...虽然这样就解决了,但是为啥呢,仔细想了想,直觉告诉我是默认问题,会不会是因为没有默认导致maxlength为0使得输入被清掉了?...可以发现显示maxlength为0 我们再去查看iviewinput组件源码 Component({ behaviors: ['wx://form-field'], externalClasses...因为组件里设置默认为100)

    2.4K20

    【React】243- 在 React 组件中使用 Refs 指南

    = this.focusTextInput.bind(this); ref 获取值 在这个例子,我们将看到如何为 input 输入框设置 ref 属性,并通过 ref 来获取值。...示例如下: 在这个例子,我们创建了一个 input 输入框来输入。然后,当单击提交按钮时,我们将读取此,并在控制台打印。...在 render 函数,我们希望读取 form输入。我们如何读取这个? 通过为 input 指定一个 ref ,然后读取 ref 。...在上面的示例应用程序,会将所有 input 标签输入在控制台打印。这里已经为 input 标签设置了 ref 属性,接下来,让我们看一下需要如何在高阶组件传递 / 转发 ref 。...…rest 是 props 解构(也就是说,我们会将 rest 数组所有参数作为 props 传递给 input 组件)。那么我们该如何使用 TextInput 组件呢?

    3.9K30

    【React】282- 在 React 组件中使用 Refs 指南

    = this.focusTextInput.bind(this); ref 获取值 在这个例子,我们将看到如何为 input 输入框设置 ref 属性,并通过 ref 来获取值。...示例如下: 在这个例子,我们创建了一个 input 输入框来输入。然后,当单击提交按钮时,我们将读取此,并在控制台打印。...在 render 函数,我们希望读取 form输入。我们如何读取这个? 通过为 input 指定一个 ref ,然后读取 ref 。...在上面的示例应用程序,会将所有 input 标签输入在控制台打印。这里已经为 input 标签设置了 ref 属性,接下来,让我们看一下需要如何在高阶组件传递 / 转发 ref 。...…rest 是 props 解构(也就是说,我们会将 rest 数组所有参数作为 props 传递给 input 组件)。那么我们该如何使用 TextInput 组件呢?

    3.3K10

    打造REST风格Spring Security配置

    组件 3.2. 认证入口点 3.3. 适合REST配置 3.4. 认证成功返回200而不是301 3.5. 认证失败返回 401 而不是 302 3.6....本文将重点讨论如何通过Login和Cookie来为REST API设置特定安全配置。...组件 组件是HTTP安全配置主要顶级组件。在当前配置,它只负责保护一个映射:/api/admin/*。...3.2.认证入口点 在一个标准web应用程序,当客户端不经过身份认证就试图访问一个安全资源时,身份认证过程可能会被自动触发——这通常是通过重定向到登录页面来实现,这样用户就可以输入认证信息了。...唯一区别是,既然我们在XML配置明确地定义了这一点——它不会Spring获得默认defaultFailureUrl——因此就不会重定向了。

    89720

    activiti工作流开发_flowable工作流

    用户名和密码: activiti-admin: admin/admin activiti-app: admin/test activiti-rest: kermit/kermit 主页应如下所示: 3.1...为简单起见,让我们将任务分配给流程启动器: 我们还希望此用户任务用户获取输入消息。为此,我们需要将Form与单个文本字段关联到此任务。...就像我们在activiti-app中看到一样,在这里我们可以更改WEB-INF / classes文件夹db.properties文件数据库设置并重新创建war文件。...我们可以按照之前基于Activiti with Java文章描述创建文件,也可以Kickstart AppProcess部分下载。...我们需要发一个POST请求,以及contentType:multipart / form-data,我们将为我们新流程上传BPMN文件,在postman设置:body中选择form,key填入file

    1.6K40

    React 结合 Rxjs 使用,管理数据

    比如用户数据在跨组件使用,当然,我们可以使用 localStorage 来管理该用户信息,这个会在下一篇文章中介绍,敬请期待~ 本文,我们主打使用 Rxjs 来管理数据。...比如我们之前讲解 了解 Angular 开发内容 - 服务 Service 和 Rxjs 怎么处理和抓取错误。当然,Rxjs 还可以用来管理数据,在组件传递数据~这是我们本文需要了解内容。...安装 Rxjs 本文演示项目,是通过 Create React App 创建,读者可以参考文章 Create React App 创建前端项目。...下面,我们以获取用户登陆信息为例子,演示如何使用 rxjs 管理数据,在 vue 同理~ PS angular-cli 项目中已经默认集成了 TypeScript 形式 Rxjs,请参考 了解...Form> ); } 然后,我们设置消费者,当 userInfoSubject$ 发生更改后,进行消费~ // arc/components/Header // 这是一个公共组件

    1.7K30

    Oracle GoldenGate微服务架构

    可以出于以下目的配置Oracle GoldenGate: 从一个数据库静态提取数据记录,并将这些记录加载到另一个数据库。...连续提取和复制事务性数据操作语言(DML)操作和数据定义语言(DDL)更改(对于受支持数据库),以保持源数据和目标数据一致性。数据库提取并复制到数据库外部文件。异构数据库源捕获。...Oracle GoldenGate MA包含五个主要组件。下图说明了复制过程如何在安全REST API环境运行。...管理服务器充当中央控制实体,用于管理Oracle GoldenGate部署复制组件。...此外,可以使用Admin Client进行REST API调用以直接与Administration Server通信,请参阅什么是Admin Client?

    1.7K20

    用于实现用python和django编写图像分类Keras UI

    可以在URL调度程序阅读有关URL更多信息。 kerasui / wsgi.py:与WSGI兼容Web服务器入口点,用于为项目提供服务。有关更多详细信息,请参阅如何使用WSGI进行部署。...它是如何构建 该应用程序分为3个模块: 管理部分: Web UI,模块和所有核心内容 后台工作者:是一个可以在后台执行Django命令,用于根据数据集训练模型 API:此部分公开API以外部与应用程序交互...通过这样类定义,所有都被设置为对实体具有可用CRUD admin.py:此图层描述了如何使用表单显示和编辑数据。 数据模型非常简单。...batch_size=dataset.batchSize, epochs=dataset.epochs, verbose=dataset.verbose) 请注意,dataset.process是在Web管理员输入...模型预测输出作为列表,选择较高索引并用于检索在训练时分配给网络输出正确标签。

    2.8K50

    这5道JavaScript题,90%开发者都做不出来

    因为很明显,带有默认参数是可选,所以这样参数不包括在函数长度。根据常识,跟随带有默认参数所有参数也是可选。因此,它们也不包括在函数长度属性。 TOP-4....默认情况下,使用Object.defineProperty()添加属性不可写,不可枚举,不可配置。 configurable 属性指定属性是否可以对象删除,以及属性描述符是否可以在将来更改。...如果输入字符串以任何其他开始,基数为10(十进制)。 根据这个定义,我们得到以下结果: parseInt(‘9’, 0) -> 基数0等同于没有基数调用。...const admin = Object.create(user); 创建了两个克隆:一个使用…spread 操作符,另一个使用 Object.assign: const clone1 = { ...admin...它们之间主要区别是,rest 操作符目标是将一些提供其余部分放入数组,而spread操作符将可迭代扩展为单个元素。

    14210

    React form 表单组件解决方案

    而对于设计一个表单组件来说,主要需要考虑以下三点: 各个元素如何排版布局 管理各个元素 表单验证(即时校验及提交全部校验) 目前已经有了一批优秀 form 表单解决方案,但是要解决上述三大问题...所以组件没有value,checkMsg(校验信息),onChange 这三个属性。其中年龄 changeAutoCheck 属性表示改变时候立即校验。...各个元素如何排版布局 首先,整个表单可以分为多个表单项。而一个表单项结构上可能会涉及到 6 个部分:label、前缀、表单元素(或自定义表单元素)、后缀、说明文字,校验态。大概如下图: ?...由于表单元素复杂性,所以组件封装默认只处理一些 type 输入框类型。对于非输入框类型表单元素,统一使用 children 形式来。...Form demo:主要将 values,checkMsg,onChange 三大属性统一集Form 组件管理,并设计了一个高阶组件 FormItemContext,简化了属性传递。

    2.3K10

    只有 10% 开发人员才可以答对 JS 面试题,测测你能答对多少

    默认情况下,使用 Object.defineProperty() 添加属性不可写、不可枚举且不可配置。 可配置属性指定是否可以对象删除属性,以及将来是否可以更改属性描述符。...如果输入字符串以任何其他开头,则基数为 10(十进制)。 根据这个定义,我们得到以下结果: parseInt('9', 0) -> radix 0 等同于没有基数调用。...在每个测验下,你都会找到关于它是如何工作详细说明。这只是对本示例代码如何工作简要描述,因为事实证明它是整个测验系列受访者最困难。 所以..让我们了解这个例子中发生了什么。...({}, admin); 你知道rest和spread算子区别吗?...它们之间主要区别在于,rest 运算符目标是在扩展运算符将可迭代对象扩展为单个元素时,将其余一些提供放入一个数组

    1K20

    Python3+ Django3:自动生成Swagger接口文档

    接下来,在本篇文章,介绍就是基于Python3+Django3下,如何接入Swagger框架,并且实现Swagger接口文档自动生成。 2....3)Swagger可在不同平台上代码注释自动生成 4)Swagger社区活跃,里面有许多强悍贡献者 3....Django接入Swagger 网上很多资料在介绍Django接入Swagger方法时,都是基于django-rest-swagger库进行讲解,都殊不知,2019年6月份开始,官方已经废弃了该库,...GitHub地址: https://github.com/marcgibbons/django-rest-swagger 所以本文也是基于drf-yasg库来实现在Django3接入Swagger框架...2、点击左侧api,展开各接口详细如下所示。 ? PS: ReDoc 是另一个 Swagger UI 工具。

    15.5K32

    Django简介

    render方法,是用来渲染模板,它会TEMPLATES配置路径中去寻找html文件。...在form表单,有GET和POST。它是根据method属性决定!一般表单使用POST 再次访问url,输入表单信息,点击提交。 输出ok,表示正常。注意:这里还没有做登录认证,下面会讲到! ?...如果没有响应,就会报错 在视图函数,render是渲染意思。那么它是如何工作呢?...(文件字符串)     else         找到 {{变量}},用render第三个参数对应进行相应替换(如果没有找到对应,{{变量}}替换为空)         HttpResponse...但是render没传,那么页面{{变量}} 会被替换为空。 如果模板里面,写了{{ }} 。变量名没写,那么页面报错 思考:如何点击时间时候,变成红色?

    1.7K20
    领券