amis源码 更新组件数据域的几种方法

news2024/12/23 6:49:53

更新组件数据域的几种方法:

默认都是合并数据,非覆盖(指定replace为true的才是覆盖):

const comp = amisScoped.getComponentById(id);//或者getComponentByName(name)

1.comp.setData(values, replace); //更新多个值values, replace可以指定是否覆盖

2.comp.props.onBulkChange(values); //更新多个值values,但是不可设置replace,为合并数据,不覆盖。

3.comp.props.onChange(value); //更新单个值。

例如:

1.Form中还可以这样更新数据域,支持replace。

1-1.formComp.setValues({'name1': 'othername'}, replace); //核心实现为:store.setValues(values, undefined, replace);   

formComp.getValues();//核心实现为: return this.props.store.data;

1-2.formComp.setData({'name1': 'othername'}, replace); //核心实现为:super.setValues(values, replace); 即formComp.setValues

formComp.getData();// 核心实现为: return this.getValues();

1-3.formComp.props.onBulkChange(values); //核心实现为:store.setValues(values);

1-4.formComp.props.onChange(value, name);//核心实现为:store.changeValue(name, value, changePristine);

store.setValues最终还调用了self.updateData(values, tag, replace, concatFields); 即iRenderer类型mobx树中的updateData动作。

2.FormItem表单项中,还能可以这样来修改其它表单项值, 支持replace

comp.props.formStore.setValues({name: 'amis'}, undefined, replace);

comp.props.onBulkChange(values); // comp.props.data   

comp.props.onChange(value);//comp.props.value

3.Page中可以这样更新数据域:

3-1.comp.setData(values, replace); //核心实现为: this.props.store.updateData(values, undefined, replace);

3-2.comp.props.onBulkChange({a: 1}); //核心实现为:this.props.store?.updateData?.(values);

//保存到event事件上下文

event.setData({ ...event.data, xx:xxx });

setValue动作原理:

if (component?.setData) {  

return component?.setData(  action.args?.value,  dataMergeMode === 'override',  action.args?.index );

} else {  return component?.props.onChange?.(action.args?.value); }

在自定义动作中通过底层代码自行模拟setValue动作,并触发formItemChange的tracker

ps: 还是建议使用amis提供的doAction()方法来处理,简单。

//可以直接获取FormItem component并通过onChange更新

let component = event.context.scoped?.['getComponentById']('u:3c0f4781736d');

component?.props.onChange?.(event.data.testVal);

const { id,  name,  label,  type,  value} = component.props;

   component.props.env?.tracker( //触发tracker追踪

     {   

       eventType: 'formItemChange',

       eventData: { id, name,  label, type, value  }

     },

     component.props

   );

//也可以获取Form component 并通过onChange修改指定FormItem项的值。

let mform = event.context.scoped?.['getComponentByName']('mform');

mform?.props.onChange?.(event.data.testVal, component?.props?.name);

//event.data 数据域数据    component.props 组件属性

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1877344.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

wget之Win11中安装及使用

wget之Win11中安装及使用 文章目录 wget之Win11中安装及使用1. 下载2. 安装3. 配置环境变量4. 查看及使用1. 查看版本2. 帮助命令3. 基本使用 1. 下载 下载地址:https://eternallybored.org/misc/wget 选择对应的版本进行下载即可 2. 安装 将下载后的wget-1.21.4-w…

Rpc服务的提供方(Rpcprovider)的调用流程

首先,服务的提供方,会通过rpcprovider向rpc服务方注册rpc服务对象和服务方法, 那么,我们通过protobuf提供的抽象层的service和method,将服务对象和它所对应的服务方法记录在map表中, 当它启动以后&#xff…

Java--常用类APl(复习总结)

前言: Java是一种强大而灵活的编程语言,具有广泛的应用范围,从桌面应用程序到企业级应用程序都能够使用Java进行开发。在Java的编程过程中,使用标准类库是非常重要的,因为标准类库提供了丰富的类和API,可以简化开发过…

电影APP——项目建议书参考

项目建议书 1. 前言1.1 实现目标1.2 项目应用范围1.3 项目名称 2. 概述2.1 国内外发展综述2.2 拟解决的问题2.2.1 业务问题2.2.2 技术需求 2.3 系统环境需求2.3.1 网络需求描述2.3.2 业务需求描述2.3.3 运行环境/用户描述 2.4 功能建议2.4.1应用场景描述2.4.2功能划分/功能模型…

Leetcode[反转链表]

LCR 024. 反转链表 给定单链表的头节点 head ,请反转链表,并返回反转后的链表的头节点。 示例 1: 输入:head [1,2,3,4,5] 输出:[5,4,3,2,1]示例 2: 输入:head [1,2] 输出:[2,1]示…

windographer数据操作教程

目录 通道设置将4个windographer文件拼到一起映射关系通道设置 先把风速列选中,将Type改为 wind speed 无需额外操作,确认一下即可

Linux(Ubuntu20.04)系统中安装deb软件包错误(依赖关系问题-仍未被配置)解决的办法

在Ubuntu16.04下采用如下dpkg命令安装deb软件安装包时: sudo dpkg -i XXXX.deb 发生安装失败,返回信息为"正处理时有错误发生",并且在安装过程中出现"依赖关系问题-仍未被配置"的提示&#xff0…

【机器学习300问】136、C4.5虽然改善了ID3决策树算法的部分缺点,但还是有不足,请问还有更好的算法吗?CART算法构建决策树

一、C4.5算法仍存在的不足 (1)计算效率不高 C4.5使用的信息增益率计算涉及熵的对数计算,特别是当属性值数量大时,计算成本较高。 (2)处理连续数值属性不够高效 ID3算法只能处理离散属性,需要预…

一个CentOS“倒下去”,更多开源创新服务器操作系统站起来

“一切过往,皆为序章。” ——出自莎士比亚的戏剧《暴风雨》 CentOS 7将在2024年6月30日正式停更,这在某种程度上宣告了国外开源操作系统一个时代的结束。那么,这是不是必然意味着,一个属于我国自主创新的开源操作…

pg_rman:备份和恢复管理工具#postgresql培训

pg_rman 是 PostgreSQL 的在线备份和恢复工具。 pg_rman 项目的目标是提供一种与 pg_dump 一样简单的在线备份和 PITR 方法。此外,它还为每个数据库集群维护一个备份目录。用户只需一个命令即可维护包括存档日志在内的旧备份。 #PG培训#PG考试#postgresql考试#pos…

Java 基本数据类型【基础篇】

目录 Java 数据类型基本数据类型整数类型【byte、short、int、long】浮点类型【float、double】布尔类型【boolean】字符类型【char】 引用数据类型 Java 数据类型 Java 语言支持的数据类型分为两种:基本数据类型 和 引用数据类型。其数据类型结构如下图所示&#x…

python-20-零基础自学python-用类和while设计一个掷多次、多面骰子的工具的基础

学习内容:《python编程:从入门到实践》第二版 知识点:类、random、while循环、把while循环和类结合起来 练习内容: 练习9-13:骰子 创建一个Die类,它包含一个名为sides的属性,该属性的默认值…

【分布式计算框架 MapReduce】MapReduce 初级编程

目录 一、MapReduce 示例程序的导入并运行测试 二、准备 4 个小文件(文件大小分别为 1.7M,5.1M,3.4M,6.8M) 1. 第一种情况,默认分片:不修改程序代码,直接使用 WordCount 源程序 2…

kali Linux基本命令(超全)_kali linux命令

一、系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件- (SMBIOS / DMI) hdparm -i /dev/hda 罗列一个磁盘的架构特性 hdparm -tT /dev/sda 在磁盘上执行测试性读取操作 cat /proc/cpu…

【UE 网络】RPC远程过程调用 入门篇

目录 0 引言1 RPC基本概念1.1 定义1.2 分类 2 RPC的使用2.1 Client RPC2.2 Server RPC2.3 Multicast RPC 🙋‍♂️ 作者:海码007📜 专栏:UE虚幻引擎专栏💥 标题:【UE 网络】RPC远程过程调用 入门篇❣️ 寄语…

【JavaScript】JavaScript简介

希望文章能给到你启发和灵感~ 如果觉得文章对你有帮助的话,点赞 关注 收藏 支持一下博主吧~ 阅读指南 JavaScript入门(1)————JavaScript简介开篇说明一、什么是JavaScript二、JavaScript的使用2.1 开发工具的选择…

UE5材质之HLSL:深度

UE4/5的Custom节点:在VScode使用HLSL(新手入门用)_vscode写hlsl-CSDN博客 效果: 材质节点: 自定义节点代码: float3 rayStepViewDir*-1; float4 inputTexTexture2DSample(TexObject,TexObjectSampler,uv)…

yolov8obb角度预测原理解析

预测头 ultralytics/nn/modules/head.py class OBB(Detect):"""YOLOv8 OBB detection head for detection with rotation models."""def __init__(self, nc80, ne1, ch()):"""Initialize OBB with number of classes nc and la…

(笔记)Error: qemu-virgl: Failed to download resource “qemu-virgl--test-image“解决方法

错误: > Downloading https://www.ibiblio.org/pub/micro/pc-stuff/freedos/files/distributions/1.2/FD12FLOPPY.zip curl: (22) The requested URL returned error: 404Error: qemu-virgl: Failed to download resource "qemu-virgl--test-image" D…

基于QT开发的气体成分检测数据记录软件

1、软件概述 气体成分检测数据记录软件用于实现多种气体分析仪及相关设备实时数据的获取、存储和传送。目前支持的设备主要有气体分析仪、多通道进样阀箱、冷阱处理系统和气体采样处理系统。   气体成分检测数据记录软件可以根据实际应用需要进行配置,以实现不同应…