Javascript——循环调接口

news2024/10/7 16:21:35

需求:同一个接口每个输入框的code传参数不一样,填一个接口成功后循环♻️调接口

在这里插入图片描述

 <div class="inching-box-radio-btn">
                        <!-- 启动 -->
                        <el-button
                          :disabled="noSecValue === true"
                          class="inching-btn inching-open"
                          @click="sectionClick(1)"
                          :value="firstOpenValue"
                          :class="
                            firstColorActive
                              ? firstColorActive === true
                                ? 'isColorActive'
                                : ''
                              : ''
                          "
                          >启动</el-button
                        >

                        <el-button
                          :disabled="noSecValue === true"
                          class="inching-btn"
                          @click="sectionClick(2)"
                          :value="firstCloseValue"
                          >关闭</el-button
                        >
                      </div>
                    </div>
                    <div class="inching-ipt inching-ipt-wap">
                      <div class="section-box-flex">
                        <div class="section-box">
                          <el-input
                            class="inching-text"
                            placeholder=""
                            v-model="firstValue"
                            :disabled="optValue === false || noSecValue === true"
                            @input="firstValueIpt"
                          >value1</el-input>
                        </div>
                        <div class="section-box">
                          <el-input
                            class="inching-text"
                            placeholder=""
                            v-model="secondValue"
                            :disabled="optValue === false || noSecValue === true"
                            @input="secondValueIpt"
                          >value2</el-input>
                        </div>
                      </div>
                      <div class="section-box-flex">
                        <div class="section-box box">
                          <el-input
                            class="inching-text"
                            placeholder=""
                            v-model="threeValue"
                            :disabled="optValue === false || noSecValue === true"
                            @input="threeValueIpt"
                          >value3 </el-input>
                        </div>

                        <div class="section-box box">
                          <el-input
                            class="inching-text"
                            placeholder=""
                            v-model.number="fourValue"
                            :disabled="optValue === false || noSecValue === true"
                            @input="fourValueIpt"
                          >value4 </el-input>
                        </div>
                      </div>
                    </div>
 //区间控制
    sectionClick(value) {
        if (value === 1) {//点击启动
          this.getSectioList('first');//循环接口
          this.secBtnValue = 1;
          this.sectionClickBtn = true;
        } else if (value === 2) {
          //关闭
          this.secBtnValue = 0;
          this.getSectioList('first');//循环接口
          this.secCloseClickBtn = true;
        }
    },

//循环♻️写值的接口
    getSectioList(item1) {
      let value = '';
      let functionCode = '';
      let secondShow = '';//定义一个变量控制调几次
      if (item1 === 'first') {
        value = this.firstValue;
        functionCode = this.openAreaCode; //74
        secondShow = 0;
      } else if (item1 === 'second') {
        value = this.secondValue;
        functionCode = this.speedAreaCode; //76
        secondShow = 1;
      } else if (item1 === 'three') {
        value = this.threeValue;
        functionCode = this.sunAreaCode; //75
        secondShow = 2;
      } else if (item1 === 'four') {
        value = this.fourValue; //77
        functionCode = this.sunSpeedAreaCode;
        secondShow = 3;
      } else if (item1 === 'btnStart') {
        secondShow = '';
        return;
      }
      let params = {
        slaveId: this.slaveIdCopy,
        valueDTO: [
          {
            functionCode: functionCode,//传参functionCode每一个输入框都不一样
            value: Number(value)
          }
        ]
      };
      writeInfo(params).then(res => {
        if (res.code === 200) {
          this.$message.success('操作成功');
          if (secondShow === 0) {
            this.getSectioList('second');
          } else if (secondShow === 1) {
            this.getSectioList('three');
          } else if (secondShow === 2) {
            this.getSectioList('four');
          } else if (secondShow === 3) {
            this.getSectioList('btnStart');
        
          }
        }
      });
    },

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

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

相关文章

cs231n assignmen3 Extra Credit: Image Captioning with LSTMs

文章目录 嫌墨迹直接看代码Extra Credit: Image Captioning with LSTMslstm_step_forward题面解析代码输出 lstm_step_backward题面解析代码输出 lstm_forward题面解析代码输出 lstm_backward题面解析代码输出 CaptioningRNN.loss解析代码输出 最后输出结语 嫌墨迹直接看代码 …

【ES6】—【新特性】—Symbol详情

一、一种新的原始数据类型 定义&#xff1a;独一无二的字符串 二、 声明方式 1. 无描述声明 let s1 Symbol() let s2 Symbol() console.log(s1, s2) // Symbol() Symbol() console.log(s1 s2) // falsePS: Symbol 声明的值是独一无二的 2. 有描述的声明 let s1 Symb…

Android自定义view实现横向滚动弹幕

参考文章 此方案使用动画方式实现&#xff0c;只适合轻量级别的弹幕滚动效果实现&#xff0c;数据量过大时会出现内存激增的情况。 效果&#xff1a; 自定义view代码 public class TumbleLayout extends ViewGroup {private final String TAG "TumbleLayout";priva…

Camunda 7.x 系列【30】中间事件

有道无术,术尚可求,有术无道,止于术。 本系列Spring Boot 版本 2.7.9 本系列Camunda 版本 7.19.0 源码地址:https://gitee.com/pearl-organization/camunda-study-demo 文章目录 1. 概述2. 消息中间事件3. 定时器中间事件4. 信号中间事件5. 错误中间事件6. 条件中间事件7…

代码随想录算法训练营第五十天|LeetCode 739,496

目录 LeetCode 739.每日温度 LeetCode 496.下一个更大元素&#xff01; LeetCode 739.每日温度 文章讲解&#xff1a;代码随想录 力扣题目&#xff1a;力扣&#xff08;LeetCode&#xff09;官网 - 全球极客挚爱的技术成长平台 代码如下&#xff08;Java&#xff09;&#xf…

Python“牵手”义乌购商品列表数据,关键词搜索义乌购API接口数据,义乌购API接口申请指南

义乌购平台API接口是为开发电商类应用程序而设计的一套完整的、跨浏览器、跨平台的接口规范&#xff0c;义乌购API接口是指通过编程的方式&#xff0c;让开发者能够通过HTTP协议直接访问义乌购平台的数据&#xff0c;包括商品信息、店铺信息、物流信息等&#xff0c;从而实现义…

国标GB28181视频平台EasyGBS视频监控平台无法播放,抓包返回ICMP排查过程

国标GB28181视频平台EasyGBS是基于国标GB/T28181协议的行业内安防视频流媒体能力平台&#xff0c;可实现的视频功能包括&#xff1a;实时监控直播、录像、检索与回看、语音对讲、云存储、告警、平台级联等功能。国标GB28181视频监控平台部署简单、可拓展性强&#xff0c;支持将…

产品经理工作常见的4大误区

产品管理对项目来说非常重要&#xff0c;但在日常工作中&#xff0c;我们往往容易进入思维误区&#xff0c;如果我们没有及时发现错误并进行纠正&#xff0c;这会对产品需求工作以及项目进度产生较大影响。 因此我们需要重视产品工作中常见的思维误区并及时避免&#xff0c;常见…

2023Web自动化测试的技术框架和工具有哪些?

Web 自动化测试是一种自动化测试方式&#xff0c;旨在模拟人工操作对 Web 应用程序进行测试。这种测试方式可以提高测试效率和测试精度&#xff0c;减少人工测试的工作量和测试成本。在 Web 自动化测试中&#xff0c;技术框架和工具起着至关重要的作用。本文将介绍几种常见的 W…

如何让你的交易高效且安全?离不开这项技术

作者&#xff5c;Jason Jiang 在区块链技术演变过程中&#xff0c;有两个关键问题始终绕不过去&#xff1a;隐私与扩容。当我们探寻这两个问题的“标准解法”时&#xff0c;却发现它们都离不开一种技术&#xff0c;那就是&#xff1a;零知识证明。什么是零知识证明&#xff1f…

Dubbo源码环境搭建

背景 Dubbo 作为一款微服务框架&#xff0c;最重要的是向用户提供跨进程的 RPC 远程调用能力。如上图所示&#xff0c;Dubbo 的服务消费者&#xff08;Consumer&#xff09;通过一系列的工作将请求发送给服务提供者&#xff08;Provider&#xff09;。 为了实现这样一个目标&a…

Apipost: 程序员必备的API管理神器

作为一款专为程序员打造的API管理工具&#xff0c;Apipost也成为开发人员圈子里的一款热门工具。Apipost拥有强大的功能和便捷操作性&#xff0c;这也让许多开发者爱不释手。那么&#xff0c;Apipost到底有哪些吸引人的特点呢&#xff1f;本文将为您详细介绍。 统一API管理 A…

【具身智能】论文系列解读-RL-ViGen

1. RL-ViGen&#xff1a;视觉泛化的强化学习基准 RL-ViGen: A Reinforcement Learning Benchmark for Visual Generalization 0 摘要与总结 视觉强化学习&#xff08;Visual RL&#xff09;与高维观察相结合&#xff0c;一直面临着分布外泛化的长期挑战。尽管重点关注旨在解…

[QT]设置程序仅打开一个,再打开就唤醒已打开程序的窗口

需求&#xff1a;speedcrunch 这个软件是开源的计算器软件。配合launch类软件使用时&#xff0c;忘记关闭就经常很多窗口&#xff0c;强迫症&#xff0c;从网上搜索对版本进行了修改。 #include "gui/mainwindow.h"#include <QCoreApplication> #include <…

如何基于自己训练的Yolov5权重,结合DeepSort实现目标跟踪

网上有很多相关不错的操作demo&#xff0c;但自己在训练过程仍然遇到不少疑惑。因此&#xff0c;我这总结一下操作过程中所解决的问题。 1、deepsort的训练集是否必须基于逐帧视频&#xff1f; 我经过尝试&#xff0c;发现非连续性的图像仍可以作为训练集。一个实例&#xff0…

kubernetes搭建及基本使用

1. 前置要求准备 一台或多台机器&#xff0c;操作系统 CentOS7.x-86_x64硬件配置&#xff1a;2GB 或更多 RAM&#xff0c;2 个 CPU 或更多 CPU&#xff0c;硬盘 30GB 或更多集群中所有机器之间网络互通可以访问外网&#xff0c;需要拉取镜像禁止 swap 分区 此处我是白嫖的谷歌云…

No122.精选前端面试题,享受每天的挑战和学习

文章目录 1、vue中key的作用2、如何让vue页面重新渲染3、组件之间通信方式4、vue为什么要mutation、 action操作5、插槽、具名插槽、作用域插槽6、用set求两个数组的交集7、树用js如何实现&#xff1f; 1、vue中key的作用 在Vue中&#xff0c;key的作用是帮助Vue识别每个VNode…

性能评估之旅:软件测试的神秘工具与方法论

引言&#xff1a;性能评估的重要性 在当今的软件开发领域&#xff0c;性能评估已经成为了一个不可或缺的环节。随着用户对于软件响应速度和稳定性的要求越来越高&#xff0c;如何确保软件在各种环境下都能稳定运行&#xff0c;成为了每一个开发者和测试者必须面对的问题。性能…

【App端】uni-app使用echarts和百度地图api

目录 前言方案一&#xff1a;echarts百度地图获取百度地图AK安装echarts和引入百度地图api完整使用代码 方案二&#xff1a;echarts地图和柱状图变形动画完整使用代码 前言 近期的app项目中想加一个功能&#xff0c;展示全国各地的某一数据统计情况&#xff0c;想来想去&#…

搭建Android自动化python+appium环境

一. 需要软件 1. JDK:JAVA安装后配置JDK环境 2. SDK:SDK下载后配置adb环境 3. Python:pyhton语言 4. Pycharm:python脚本编译工具 5. Appium-python-client:pyhton中的库 6. Appium客户端 二. 搭建步骤 1. 配置JDK环境 ①. 下载安装java: https://www.oracle.com/jav…