avue vue 监听表格中值，或者下拉框选择的值，动态改变下面

本文链接：https://blog.youkuaiyun.com/chengchong_cc/article/details/137641025

文章描述了一个关于前端开发中动态表单处理的应用，通过监听用户在`appCategory`下拉菜单的选择，控制不同字段如`appSecret`、`originalId`等的显示状态，同时当应用名称为融合通信时，调整`visibleRange`的选择限制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

    watch: {
      'form.appCategory': {//获取form中select选择的值
        handler(val) {
          console.log("监听", val)
          if (val == 'H5') {
            val = 1
          }
          if (val == '原生') {
            val = 2
          }
          if (val == '微信小程序') {
            val = 3
          }
          if (val == '' || val == 'undefined') {
            val = 11;  //自定义值，默认不展示
          }
          let appSecret = this.findObject(this.option.column, 'appSecret')
          let originalId = this.findObject(this.option.column, 'originalId')
          let applicationUrl = this.findObject(this.option.column, 'applicationUrl')
          let homePath = this.findObject(this.option.column, 'homePath')
          let visibleRange = this.findObject(this.option.column, 'visibleRange')
          if (val == 1) {
            appSecret.display = true
            originalId.display = false
            applicationUrl.display = true
            homePath.display = false
          } else if (val == 2) {
            appSecret.display = false
            originalId.display = false
            applicationUrl.display = false
            homePath.display = false
            visibleRange.display = true
          } else {
            appSecret.display = false
            applicationUrl.display = false
            if (val == 11) {
              originalId.display = false
              homePath.display = false
              visibleRange.display = false
            } else {
              originalId.display = true
              homePath.display = true
              visibleRange.display = false
            }
          }
        }
      },
      'form.applicationName': {
        //监听应用名称，如果名称等于融合通信，可以范围选择安卓可见并且置灰
        handler(val) {
          // console.log("监听applicationName", val)
          let visibleRange = this.findObject(this.option.column, 'visibleRange');
          if (val != '' && val != undefined && val == '融合通信') {
            visibleRange.disabled=true;
            this.form.visibleRange='1';
          }else{
            visibleRange.disabled=false;
          }
        }
      },
    }