开发者社区> 问答> 正文

宜搭子表单中,如何用onchange设置,将两个级联组件的最后一级值相乘,赋值给一个文本组件?

111111.jpg

展开
收起
游客2ax3djd3264us 2024-09-14 09:58:31 49 0
来自:钉钉宜搭
2 条回答
写回答
取消 提交回答
  • 如果问题得到了解决,辛苦点下采纳回答哦~

    可以使用子表单 APIupdateItemValue来更新子表单当前行其他字段的数据,官方教程:https://docs.aliwork.com/docs/yida_support/wtwabe/gdi5p8/up3ftx/in0w72#yDEDZ

    2024-09-14 14:49:39
    赞同 4 展开评论 打赏
  • 要在宜搭子表单中利用onChange事件设置,实现两个级联组件最后一级值相乘并赋值给一个文本组件,您可以按照以下步骤操作:

    1. 监听级联组件变化

      • 对于两个级联组件,假设分别为cascadeComponent1cascadeComponent2,您需要分别为它们的onChange事件编写处理函数。这将在用户更改选择时触发。
    2. 获取级联组件值

      • 在每个级联组件的onChange事件处理函数中,通过event.value获取当前选中的最后一级值。例如,对于cascadeComponent1,您会得到value1;对于cascadeComponent2,则得到value2
    3. 计算乘积

      • 在任一onChange函数内部(或合并处理这两个事件以减少冗余),将value1value2相乘得到乘积结果。例如,let product = value1 * value2;
    4. 更新文本组件值

      • 使用await page.setComponentValue('textComponentId', product.toString());方法,将计算得到的乘积结果赋值给文本组件。这里textComponentId是您希望显示乘积结果的文本组件的ID。
    5. 合并事件处理逻辑(可选):

      • 如果希望在一个函数内同时处理两个级联组件的变化并计算,可以设计一个统一的处理逻辑,确保每次任一组件变化时都重新计算并更新文本组件。

    代码示例(基于宜搭的JavaScript处理逻辑):

    export async function onChangeComponent1({ value }) {
      await updateProduct(value, getSecondComponentValue());
    }
    
    export async function onChangeComponent2({ value }) {
      await updateProduct(getFirstComponentValue(), value);
    }
    
    async function updateProduct(value1, value2) {
      if (value1 && value2) {
        let product = value1 * value2;
        await page.setComponentValue('textComponentId', product.toString());
      }
    }
    
    function getFirstComponentValue() {
      // 实现获取第一个级联组件当前值的逻辑
    }
    
    function getSecondComponentValue() {
      // 实现获取第二个级联组件当前值的逻辑
    }
    

    请根据实际情况调整组件ID和具体的值获取逻辑。这样,每当两个级联组件的值发生变化时,文本组件就会自动更新为它们乘积的结果。

    2024-09-14 13:58:58
    赞同 6 展开评论 打赏
来源圈子
更多
收录在圈子:
+ 订阅
「宜搭」是云钉原生低代码平台(钉钉 PaaS - aPaaS),让企业应用搭建更简单! 帮助中小企业降本提效,加强组织的数字化自主权; 帮助大型企业释放个体创新力,助力组织创新涌现。
相关文档: 宜搭
问答排行榜
最热
最新

相关电子书

更多
宜搭 - 企业智能化应用搭建平台 立即下载
《云市场-宜搭解决方案》 立即下载
《宜搭开发手册》 立即下载