【示例中心案例分享】表单中级联组件配置表单数据源

简介: 宜搭的级联组件不像下拉选择一样可配置关联其他选项,但是每次手动配置级联选项又很痛苦,我们如何借助宜搭的 OpenApi 去实现这个功能呢?我们的三方开发者 「苏灏」带来了他的案例。

1、核心代码

// 级联选项数据处理exportfunctiontransformData(inputStr) {
constrows=inputStr.map(item=> {
returndataSourceList.map(_item=> {
returnitem[_item]
    }).filter(item=> {
return!!item    });
  });
constres= {
children: {}
  };
rows.forEach(row=> {
row.reduce((pre, cur) => {
if (!pre.children[cur]) {
pre.children[cur] = {
label: cur,
value: pre.value?`${pre.value}_${cur}` : cur,
children: {}
        }
      }
returnpre.children[cur];
    }, res);
  });
constmapToArray= (map) => {
returnObject.values(map).map(item=> {
if (item.children) {
item.children=mapToArray(item.children);
      }
if (Object.keys(item.children).length===0) {
deleteitem.children;
      }
returnitem;
    });
  };
returnmapToArray(res.children);
}

2、实现效果

3、在线试玩

示例中心 | 表单中级联组件配置表单数据源

目录
相关文章
|
移动开发 监控 Android开发
Android & iOS 使用 ARMS 用户体验监控(RUM)的最佳实践
本文主要介绍了 ARMS 用户体验监控的基本功能特性,并介绍了在几种常见场景下的最佳实践。
1084 96
|
10月前
|
存储 人工智能 缓存
全新「宜搭出海版」,跨境业务一搭搞定!
在全球化竞争中,中国出海企业面临高增长与抗风险的双重挑战。宜搭基于低代码平台推出「宜搭出海版」,专注解决跨境业务的核心痛点。提供15种语言+AI翻译、全球文件速传、国际化时区协同、全球地址定位、国际化邮箱、货币支持及离线能力等功能,助力企业实现高效、敏捷的全球业务拓展。版本包括面向中国出海企业的“宜搭出海版”和面向海外客户的“宜搭国际版”。
512 17
|
2天前
|
JavaScript Shell API
如何在 OpenClaw(原Clawdbot/Moltbot) 配置阿里云百炼 API
OpenClaw(前身为Clawdbot、Moltbot)作为一款开源AI个人助手,支持本地部署与多平台兼容,能通过自然语言指令实现设备控制、任务自动化及多工具协同,广泛适配Qwen、Claude、GPT等主流大语言模型。若需让OpenClaw具备更强大的智能交互与任务处理能力,可接入阿里云百炼平台的大模型服务(如通义千问3系列)。本文将严格遵循技术实操逻辑,详细拆解从环境准备、API获取到配置验证的完整流程,确保操作步骤的准确性与可落地性。
495 5
|
消息中间件 安全 API
记项目的一次发送短信及短信模板配置分享
我们日常使用的软件或者网站,大部分都在使用短信业务,比如 注册 、 验证码功能 。还有一些特定的业务需要发送短信通知国内外用户等。有了需求就会有平台提供服务,国内有很多互联网公司都提供短信业务,比如阿里云、腾讯云、七牛。本次我们主要讲解的是阿里云提供的短信服务。
记项目的一次发送短信及短信模板配置分享
|
11月前
|
人工智能 前端开发 JavaScript
纯干货!如何用Cursor+宜搭,3天完成三周开发量(附超详细视频教学)
Cursor是热门代码编辑器之一,通过与宜搭(Yida)结合,提供了强大的低代码页面和自定义组件生成能力。方案利用Claude模型的代码生成能力及MCP支持,大幅提升开发效率。开发者可通过Cursor连接宜搭表单设计器或自定义组件设计器,实现React源码的生成与同步,并支持二次编辑。现有功能涵盖文本、数字、图片、链接等多种字段类型,以及属性面板配置、JS代码生成等。
2199 83
|
12月前
|
人工智能 JavaScript 搜索推荐
宜搭融合 DeepSeek R1 满血版!手把手教你玩转低代码 AI 产品
AI技术的迅猛发展,特别是DeepSeek的推出,为企业带来了前所未有的智能化体验。当低代码平台与AI技术结合时,迸发出丰富的应用场景。本文详细介绍如何通过宜搭平台使用DeepSeek,涵盖网页版、AI助理版、AI生成组件、连接器等功能,帮助用户轻松实现智能化业务系统。
1826 7
宜搭融合 DeepSeek R1 满血版!手把手教你玩转低代码 AI 产品
|
12月前
|
人工智能 自然语言处理 JavaScript
宜搭上新,DeepSeek 插件来了!
钉钉宜搭近日上线了DeepSeek插件,无需编写复杂代码,普通用户也能轻松调用强大的AI大模型能力。安装后,平台新增「AI生成」组件,支持创意内容生成、JS代码编译、工作汇报等场景,大幅提升工作效率。快来体验这一高效智能的办公方式吧!
2849 9
|
6月前
|
弹性计算 运维 安全
了解权限管理:数字化时代的安全基石
在数字化时代,权限管理作为信息安全的核心机制,通过定义“谁”能对“什么”执行“何种操作”,有效防范未授权访问与数据泄露,广泛应用于个人设备、企业系统与云端服务。它不仅保障安全,还提升业务效率与合规性,是数字化转型的关键支撑。
557 12
如何在项目中使用Moment.js库?
如何在项目中使用Moment.js库?
|
人工智能 供应链 大数据
数字化技术核心环节及其在供应链的应用
数字化技术核心环节包括云计算、大数据、区块链、人工智能和移动互联网。这些技术相互作用,共同构建了数字化技术生态系统,推动经济社会发展。其中,云计算提供算力支持,大数据提供信息资源,区块链构建信任机制,移动互联网连接一切。区块链在供应链领域的应用尤为突出,通过数据共享、可追溯性和智能合约等特性,解决了供应链中的信息孤岛、数据真实性和业务效率等问题,提升了供应链的整体协同和管理效率。