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 组件属性

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

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

相关文章

Linux多进程和多线程(一)

进程 进程的概念 进程(Process)是操作系统对一个正在运行的程序的一种抽象。它是系统运行程序的最小单位,是资源分配和调度的基本单位。 进程的特点如下 进程是⼀个独⽴的可调度的活动, 由操作系统进⾏统⼀调度, 相应的任务会被调度到cpu …

Python逻辑控制语句 之 判断语句--if else结构

1.if else 的介绍 if else :如果 ... 否则 .... 2.if else 的语法 if 判断条件: 判断条件成立,执行的代码 else: 判断条件不成立,执行的代码 (1)else 是关键字, 后⾯需要 冒号 (2)存在冒号…

【BILIBILIAS】安卓端B站视频下载神器,4K画质轻松get!

B站视频下载的方法之前给大家分享过网页版和电脑版的工具《太猛了!B站视频下载方法!三端通用!》,但是手机上的工具没有给大家分享过。今天今天就给大家分享一个安卓端的B站视频下载神器——BILIBILIAS,可以轻松下载4K画…

【UE 网络】专用服务器和多个客户端加入游戏会话的过程,以及GameMode、PlayerController、Pawn的创建流程

目录 0 引言1 多人游戏会话1.1 Why?为什么要有这个1.2 How?怎么使用? 2 加入游戏会话的流程总结 🙋‍♂️ 作者:海码007📜 专栏:UE虚幻引擎专栏💥 标题:【UE 网络】在网络…

Linux部署Java项目至云服务器

文章目录 1.服务器环境2.发布部署过程2.1 执行SQL脚本2.2 修改代码中数据源的配置2.3 修改配置中的日志级别与日志文件路径2.4 打包Java程序2.5 上传到服务器2.6 后台运行2.7 服务器开放对应的端口2.8 访问验证 1.服务器环境 要将我们的项目部署到云服务器上我们就需要先有一个…

2024年值得信赖的在线代理IP服务商

在当今的网络世界中,代理IP服务成为了许多企业和个人在进行网络数据处理、多账号管理等任务时不可或缺的工具。然而,面对市场上众多的代理IP服务商,如何挑选出真正值得信赖的服务商成为了一大难题。作为专业的测评团队,我们近期对…

基于MIMO系统的预编码matlab性能仿真

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 4.1 最小均方误差(MMSE)准则 4.2 量化准则 5.算法完整程序工程 1.算法运行效果图预览 (完整程序运行后无水印) 2.算法运行软件版本 MATLAB2022a 3.部分核心程序 …

HarmonyOS APP应用开发项目- MCA助手(持续更新中~)

简言: gitee地址:https://gitee.com/whltaoin_admin/money-controller-app.git端云一体化开发在线文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/agc-harmonyos-clouddev-view-0000001700053733-V5 注&#xff1…

【PyQt】20-QTimer(动态显示时间、定时关闭)

QTimer 前言一、QTimer介绍二、动态时间展示2.1 代码2.2 运行结果 三、定时关闭3.1 介绍他的两种用法1、使用函数或Lambda表达式2、带有定时器类型(高级) 3.2 代码3.3 运行结果 总结 前言 好久没学习了。 一、QTimer介绍 pyqt里面的多线程可以有两种实…

微信内置H5支付

🧑‍💻 写在开头 点赞 收藏 学会🤣🤣🤣 场景是用户通过微信扫app内的收款码,跳到一个h5页面。然后完成支付。 代码实现的整体流程: 使用微信扫码,码是app内生成的,码…

Day38:LeedCode 1049. 最后一块石头的重量 II 494. 目标和 474.一和零

1049. 最后一块石头的重量 II 有一堆石头&#xff0c;用整数数组 stones 表示。其中 stones[i] 表示第 i 块石头的重量。 每一回合&#xff0c;从中选出任意两块石头&#xff0c;然后将它们一起粉碎。假设石头的重量分别为 x 和 y&#xff0c;且 x < y。那么粉碎的可能结果…

Java的NIO体系

目录 NIO1、操作系统级别下的IO模型有哪些&#xff1f;2、Java语言下的IO模型有哪些&#xff1f;3、Java的NIO应用场景&#xff1f;相比于IO的优势在哪&#xff1f;4、Java的IO、NIO、AIO 操作文件读写5、NIO的核心类 :Buffer&#xff08;缓冲区&#xff09;、Channel&#xff…

【proteus 51单片机入门】8*8led点阵

文章目录 前言如何点亮led点阵仿真图代码点亮led核心代码解析 爱心代码 滚动总结 前言 在嵌入式系统的开发中&#xff0c;LED点阵显示器是一种常见的显示设备&#xff0c;它可以用来显示各种图形和文字&#xff0c;为用户提供直观的信息反馈。本文将介绍如何使用Proteus软件和…

使用 MongoDB 剖析开放银行:技术挑战和解决方案

开放银行&#xff08;或开放金融&#xff09;在银行业掀起了一股颠覆性浪潮&#xff0c;它迫使金融机构&#xff08;银行、保险公司、金融科技公司、企业甚至政府机构&#xff09;迎接一个透明、协作和创新的新时代。这种模式转变要求银行与第三方提供商&#xff08;TPP&#x…

如何在 SQL 中删除一条记录?

如何在 SQL 中删除一条记录&#xff1f; 在 SQL 中&#xff0c;您可以使用DELETE查询和WHERE子句删除表中的一条记录。在本文中&#xff0c;我将向您介绍如何使用DELETE查询和WHERE子句删除记录。我还将向您展示如何一次从表中删除多条记录 如何在 SQL 中使用 DELETE 这是使…

【计算机图形学】期末考试知识点汇总(上)

文章目录 视频教程第一章 计算机图形学概述计算机图形学的定义计算机图形学的应用计算机图形学 vs 图像处理 vs模式识别图形显示器的发展及工作原理理解三维渲染管线 第二章 基本图元的扫描转换扫描转换直线的扫描转换DDA算法Bresenham算法中点画线算法圆的扫描转换中点画圆算法…

面试-J.U.C包的梳理

1.J.U.C包的梳理 Java.Util.Concurrent包简称JUC (1)JUC整体架构图 (2)分析 Executor&#xff1a;线程执行器&#xff0c;任务执行和调度的框架。Tools下存在executor相关的executors类&#xff0c;用于创建executorservice&#xff0c;scheduleexecutorservice&#xff0c;…

哪吒汽车,正在等待“太乙真人”的拯救

文丨刘俊宏 在360创始人、哪吒汽车股东周鸿祎近日连续且着急的“督战”中&#xff0c;哪吒汽车&#xff08;下简称哪吒&#xff09;终究还是顶不住了。 6月26日&#xff0c;哪吒通过母公司合众新能源在港交所提交了IPO文件&#xff0c;急迫地希望成为第五家登陆港股的造车新势力…

高精度除法的实现

高精度除法与高精度加法的定义、前置过程都是大致相同的&#xff0c;如果想了解具体内容&#xff0c;可以移步至我的这篇博客&#xff1a;高精度加法计算的实现 在这里就不再详细讲解&#xff0c;只讲解主体过程qwq 主体过程 高精度除法的原理和小学学习的竖式除法是一样的。 …

【Sklearn-驯化】一文搞懂机器学习树模型建模可视化过程

【Sklearn-驯化】一文搞懂机器学习树模型建模可视化过程 本次修炼方法请往下查看 &#x1f308; 欢迎莅临我的个人主页 &#x1f448;这里是我工作、学习、实践 IT领域、真诚分享 踩坑集合&#xff0c;智慧小天地&#xff01; &#x1f387; 免费获取相关内容文档关注&#xff…