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

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

默认都是合并数据,非覆盖(指定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 组件属性

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

开启网络监控新纪元:免费可视化工具助力网络信息链路拓扑监控大屏

在数字化浪潮汹涌的今天,网络已成为我们生活、工作的不可或缺的一部分。然而,你是否曾经想过,在这个庞大的网络世界中,是谁在默默守护着每一条信息的传输,确保我们的数据安全、稳定地抵达目的地? 网络信息链…

昇思MindSpore学习总结五——网络构建

1、网络构建 神经网络模型是由神经网络层和Tensor操作构成的,mindspore.nn提供了常见神经网络层的实现,在MindSpore中,Cell类是构建所有网络的基类,也是网络的基本单元。一个神经网络模型表示为一个Cell,它由不同的子C…

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

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

STM32CUBEMX配置USB虚拟串口

STM32CUBEMX配置USB虚拟串口 cubemx上默认配置即可。 外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传 配置完后生成工程,主要就是要知道串口的收发接口就行了。 发送:CDC_Transmit_FS(),同时记得包含头文件#include “…

转运机器人:智能物流的得力助手

在物流行业,转运机器人已经成为提高转运效率、降低成本的重要工具。而富唯智能转运机器人凭借其出色的性能和智能化的设计,成为了众多企业的得力助手。 富唯智能转运机器人采用了先进的AMR控制系统,可以一体化控制移动机器人并实现与产线设备…

电脑提示vcomp140.dll丢失的几种有效的解决方法,轻松搞定dll问题

在电脑使用过程中,我们可能会遇到一些错误提示,其中之一就是找不到vcomp140.dll。那么,究竟什么是vcomp140.dll呢?为什么会出现找不到vcomp140.dll的情况呢?本文将从vcomp140.dll的定义、常见原因、对电脑的影响以及解…

go语言DAY7 字典Map 指针 结构体 函数

Go中Map底层原理剖析_go map底层实现-CSDN博客 目录 Map 键值对key,value 注意: map唯一确定的key值通过哈希运算得出哈希值 一、 map的声明及初始化: 二、 map的增删改查操作: 三、 map的赋值操作与切片对比: 四、 通用所有…

最佳学习率和Batch Size缩放中的激增现象

前言 《Surge Phenomenon in Optimal Learning Rate and Batch Size Scaling》原文地址GitHub项目地址Some-Paper-CN。本项目是译者在学习长时间序列预测、CV、NLP和机器学习过程中精读的一些论文,并对其进行了中文翻译。还有部分最佳示例教程。如果有帮助到大家&a…

C语言学习记录(十二)——指针与数组及字符串

文章目录 前言一、指针和数组二、指针和二维数组**行指针(数组指针)** 三、 字符指针和字符串四、指针数组 前言 一个学习嵌入式的小白~ 有问题评论区或私信指出~ 提示:以下是本篇文章正文内容,下面案例可供参考 一、指针和数组 在C语言中 &#xff0…

网盘挂载系统-知识资源系统-私域内容展示系统

系统介绍: 存储:一共支持约30款云盘存储,其中包括主流的(百度网盘、阿里云盘、夸克云盘、迅雷云盘、蓝奏云、天翼云盘),部分展示 以及特别的(一刻相册、对象存储、又拍云存储、SFTP、MEGA 网盘…

锁机制 -- 概述篇

锁机制 1、概述 ​  加锁是为了解决并发场景下,多个线程对同一资源同时进行操作,而导致同一线程多次操作出现结果不唯一的情况(一次操作包含多条指令)。结果不唯一发生的原因在于指令的错乱,前提条件是多线程环境及…

原子变量原理剖析

一、原子操作 原子操作保证指令以原子的方式执行,执行过程不被打断。先看一个实例,如下所示,如果thread_func_a和thread_func_b同时运行,执行完成后,i的值是多少? // test.c static int i 0;void thread…

013、MongoDB常用操作命令与高级特性深度解析

目录 MongoDB常用操作命令与高级特性深度解析 1. 数据库操作的深入探讨 1.1 数据库管理 1.1.1 数据库统计信息 1.1.2 数据库修复 1.1.3 数据库用户管理 1.2 数据库事务 2. 集合操作的高级特性 2.1 固定集合(Capped Collections) 2.2 集合验证(Schema Validation) 2.…

自组装mid360便捷化bag包采集设备

一、问题一:电脑太重,换nuc 采集mid360数据的过程中,发现了头疼的问题,得一手拿着电脑,一手拿着mid360来采集,实在是累胳膊。因此,网购了一个intel nuc, 具体型号是12wshi5000华尔街峡谷nuc12i…

Python私教张大鹏 PyWebIO通过事件回调实现表格的编辑和删除功能

从上面可以看出,PyWebIO把交互分成了输入和输出两部分:输入函数为阻塞式调用,会在用户浏览器上显示一个表单,在用户提交表单之前输入函数将不会返回;输出函数将内容实时输出至浏览器。这种交互方式和控制台程序是一致的…

在Ubuntu 18.04.6 LTS 交叉编译生成Windows 11下的gdb 8.1.1

1. 安装mingw sudo apt-get install mingw-w64 2. 下载 gdb 8.1.1源码 https://ftp.gnu.org/gnu/gdb/gdb-8.1.1.tar.gz 解压命令 tar -xf gdb-8.1.1.tar.gz 进入目录,创建build目录: hq@hq:~/gdb-8.1.1/build$ 执行配置 ../confi

视频云计算的未来发展趋势:智能化、个性化与云端协同助力智慧城市安防监控

随着信息技术的飞速发展,云计算作为一种全新的服务模式,正在改变我们处理数据和信息的方式。而视频云计算技术,作为云计算领域的一个重要分支,以其独特的优势,正在逐步渗透到我们生活的各个领域。 一、视频云计算技术…

[leetcode hot 150]第一百二十二题,买卖股票的最佳时机Ⅱ

题目: 给你一个整数数组 prices ,其中 prices[i] 表示某支股票第 i 天的价格。 在每一天,你可以决定是否购买和/或出售股票。你在任何时候 最多 只能持有 一股 股票。你也可以先购买,然后在 同一天 出售。 返回 你能获得的 最大…

javaScript利用indexOf()查找字符串的某个字符出现的位置

1 创建字符串 2 利用indexof()查询字符串的字符 3 利用while循环判断indexOf是否等于-1,不等于-1就打印一次并且索引号1去查下一个字符 //创建字符串var str1234567812311231;var indexstr.indexOf(1);//查询该字符while(index !-1)//indexOf()没有查到会返回-1{…

企业本地大模型用Ollama+Open WebUI+Stable Diffusion可视化问答及画图

最近在尝试搭建公司内部用户的大模型,可视化回答,并让它能画图出来, 主要包括四块: Ollama 管理和下载各个模型的工具Open WebUI 友好的对话界面Stable Diffusion 绘图工具Docker 部署在容器里,提高效率以上运行环境Win10, Ollama,SD直接装在windows10下, 然后安装Docker…