随笔 - 33  文章 - 0  评论 - 5  阅读 - 15万

vue记录

  •  vue项目中使用默认图片代替异常图片

  • 第一种方法

 

<img onerror="javascript:this.src='../../static/custom.png';"  class="customerHead" :src="param.customerHead" alt="">

 

图片不存在时,触发 onerror,显示custom.png

  • 第二种方法

 

<img :onerror="errpic" class="customerHead" :src="param.customerHead" alt="">

 

复制代码


data() {

  return {

    errpic:'this.src="' + require('../../assets/img/errpic.png') + '"',

  }

}
复制代码

  vue 替换图片 

<img :src="calcuImgUrl" alt="">
data() {
    return {
         calcuImgUrl:require('../../assets/img/calcu0.png')   
    }
}

 

mounted(){if(G.calculateState=="2"){
            this.calcuImgUrl = require('../../assets/img/calcu2.png');

        }

    },

 

 

vue  watch 监听

复制代码
    watch:{
            param:{
                handler(val,oldval){
                    var ct=this.param.certificate;
                    var cf=this.param.certificateNum;
                    if((ct==""||ct==null)&&(cf==""||cf==null)){
                        this.disabled_startname=true;
                        this.disabledInput=true;
                        this.disabledVild=true;
                    }
                },
                deep:true  //深度监听
            }
        },
复制代码

 

vue  computed 计算属性

复制代码
computed:{
            complate_message(){
                if(this.param.weight !== "" && this.param.height !==""){
                    let BMI =Math.round(this.param.weight/((this.param.height/100)*(this.param.height/100))*10)/10
                    return BMI
                }else{
                    return 0
                }
            },
        },
复制代码

 

vue  disabled属性更改

复制代码

<div class="public_container">
  <li class="style-li-css6">证件号码:</li>
    <input type="text"  ref="certificateNum"v-on:blur="changeAge(param.certificateNum)" v-model="param.certificateNum">
  </li>
</div>

<div class="customer_sex" style="float:left;line-height:2;margin-left:35px;">
      <el-checkbox :label="1" v-model="param.checked" @change="changeVid(param.checked)"
             v-bind:disabled="disabledVild">长期有效</el-checkbox>
</div>
复制代码
data(){
    return {
        disabledVild:false
      }
}
methods:{
   onSelectedDrug(event,value) {
    if(value=="4"|value=="6"){
    this.disabledVild=true; } }

 

posted on   风景1573  阅读(245)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 25岁的心里话
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

点击右上角即可分享
微信分享提示