ngsl8755 2022-01-20 14:43 采纳率: 70%
浏览 40
已结题

为什么我的disabled控制台打印成功,但是赋值并没有赋给:disabled?

img


需要实现这么一个功能:
点击radio1,区间选择启用,点选择禁用;点radio2,区间选择禁用,点选择启用

                    <a-radio-group v-model="value" @change="handleDisabledChange" >
                      <a-row :gutter="24" class="screenRow">
                        <a-col :span="1" style="padding-bottom: 8px;">
                          <a-radio 
                            name="dtGroup"
                            :value="1" />
                        </a-col>
                        <a-col :span="23" style="padding-bottom: 8px;">
                          <a-form-item
                          label="时间区间选择">
                            <a-range-picker
                              format="YYYY-MM-DD"
                              :placeholder="['开始日期', '结束日期']"
                              ref='setDateRef'
                              @change='setDate'
                              :allowClear='false'
                              :disabled='!disabled' />
                          </a-form-item>
                        </a-col>
                      </a-row>
                      <a-row :gutter="24" class="screenRow">
                        <a-col :span="1">
                          <a-radio 
                            name="dtGroup"
                            :value="2" />
                        </a-col>
                        <a-col :span="13">
                          <a-form-item
                          label="时间点选择">
                            <a-date-picker
                              ref='pointDateRef'
                              @change="onChange"
                              :disabled='!disabled' />
                          </a-form-item>
                        </a-col>
                        <a-col :span="8" :style="{textAlign: 'right'}">
                          <a-button type="primary" @click='timeGetList(1)'>
                            查询
                          </a-button>
                        </a-col>
                      </a-row>
                    </a-radio-group>
     handleDisabledChange(e) {
      var i = e.target.value;
      for (var j = 1; j <= i; j++) {
        if (e.target.value == 1) {
          console.log('我是区间时间:'+j);
          if (e.target.value == 1) {
            console.log(this.$refs.setDateRef.disabled);
            this.$refs.setDateRef.disabled = !this.$refs.setDateRef.disabled;
            console.log(this.$refs.setDateRef.disabled);
          } else {
            this.$refs.pointDateRef.disabled = this.$refs.pointDateRef.disabled;
          }
        } else {
          console.log('我是点时间:'+j);
          if (e.target.value == 2) {
            this.$refs.pointDateRef.disabled = !this.$refs.pointDateRef.disabled;
          } else {
            this.$refs.setDateRef.disabled = this.$refs.setDateRef.disabled;
          }
        }
      }
    },

现在这样写导致控制台可以打印出结果,但是并没有将disabled的值赋给:disabled;

img

各位!该怎么解决,我第一次碰vue,可以说的详细点儿吗!谢谢了!

  • 写回答

1条回答 默认 最新

  • 归来巨星 前端领域新星创作者 2022-01-20 15:15
    关注

    disabled 这个是个动态属性,你不要直接去操作 节点变更 disabled, 视图上面的disabled可以直接变更的

    在data里面声明两个 setDateRefDisabled ,pointDateRefDisabled 各自绑定对应的 节点然后即可实现数据视图变更

    handleDisabledChange(e) {
          var i = e.target.value;
          for (var j = 1; j <= i; j++) {
            if (e.target.value == 1) {
              console.log('我是区间时间:'+j);
              if (e.target.value == 1) {
           
                this.setDateRefDisabled = !this.setDateRefDisabled
          
              } else {
                this.pointDateRefDisabled = !this.this.pointDateRefDisabled
    
              }
            } else {
              console.log('我是点时间:'+j);
              if (e.target.value == 2) {
                this.pointDateRefDisabled = !this.this.pointDateRefDisabled
              } else {
                this.setDateRefDisabled = !this.setDateRefDisabled
              }
            }
          }
        },
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 1月28日
  • 已采纳回答 1月20日
  • 创建了问题 1月20日

悬赏问题

  • ¥20 机器学习能否像多层线性模型一样处理嵌套数据
  • ¥20 西门子S7-Graph,S7-300,梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题
  • ¥15 matlab不知道怎么改,求解答!!
  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗?在Android studio上该如何部署?
  • ¥20 docker里部署springboot项目,访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效