vue中添加change的js事件并根据下拉框内容动态改变另一个组件中的数据(亲测有效)

vue中添加change的js事件并根据下拉框内容动态改变另一个组件中的数据
话不多说看我怎么完成的,以我当前实现的例子演示
我想根据班级下拉框来动态改变报名费内容在这里插入图片描述

具体步骤如下:
1.首先给下拉框的组件加一个change
在这里插入图片描述
@change=“changeFeiByclass”
2.在method中定义一个下拉框事件的方法
在这里插入图片描述
对里面的代码说一下:
this.entity.classId:这个是下拉框绑定的id,
全局定义了一个变量用来存储下拉框获取的数据,
this.entity.baomingCoost:这个是报名费的组件v-model的内容
在这里插入图片描述

changeFeiByclass(){
   
      var className=this.entity.classId;
      console.log('classId:'+this.entity.classId);
      this.classDatas.forEach(item=>{
   
            if (item.id==this.entity.classId) {
   
              this.entity.baomingCoost=item.baomingCoost;
            }
          })
    }

流程和代码给你了 ,加油哦!

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-22 18:32:01       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-22 18:32:01       100 阅读
  3. 在Django里面运行非项目文件

    2023-12-22 18:32:01       82 阅读
  4. Python语言-面向对象

    2023-12-22 18:32:01       91 阅读

热门阅读

  1. Android Studio 显示Cause: connect timed out

    2023-12-22 18:32:01       61 阅读
  2. day6 力扣公共前缀--go实现---对字符串的一些思考

    2023-12-22 18:32:01       58 阅读
  3. hive中array相关函数总结

    2023-12-22 18:32:01       65 阅读
  4. 自定义ORM(mybatis)源码(一)-解析config.xml

    2023-12-22 18:32:01       54 阅读
  5. Semaphore的简单使用

    2023-12-22 18:32:01       52 阅读
  6. flutter学习-day16-自定义组件

    2023-12-22 18:32:01       66 阅读
  7. P8736 [蓝桥杯 2020 国 B] 游园安排

    2023-12-22 18:32:01       50 阅读
  8. GO设计模式——21、观察者模式(行为型)

    2023-12-22 18:32:01       57 阅读
  9. 常用英文缩略词

    2023-12-22 18:32:01       61 阅读