Vue style 动态绑定

方法1:

<div class="flex peopleRygl-main-left-nr03 " :style="divStyleZdfw() ">

return{
	divStyle11: {
        color: 'red',
        fontSize: '14px',
        backgroundColor: 'yellow',
        alignItems: 'flex-start'
      }
}

 divStyleZdfw(param){
      console.log(new Date().toLocaleString())
      console.log(param)
      return this.divStyle11
    }

方法2:

<div class="flex peopleRygl-main-left-nr03 " :style="{ backgroundColor: 'yellow',alignItems:'flex-start' }">

方法3:

<div class="flex peopleRygl-main-left-nr03 " :style="{alignItems:divStyleZdfw(peopleForm) }">

    divStyleZdfw(param){
      // let rStyle = "{align-items: flex-start;}"
      // if(validatenull(param) || validatenull(param.zdfw)) return rStyle;
      // if(param.zdfw.length > 12) rStyle = "{align-items: flex-center;}"
      // return rStyle;
      console.log(new Date().toLocaleString())
      console.log(param)
      return "center"
    }

方法4:

<div class="flex peopleRygl-main-left-nr03 " :style="divStyleZdfw(peopleForm)">

   divStyleZdfw(param){
      let rStyle = {alignItems: 'flex-start'}
      // if(validatenull(param) || validatenull(param.zdfw)) return rStyle;
      // if(param.zdfw.length > 12) rStyle = {alignItems: 'center'}
      rStyle = {alignItems: 'center'}
      return rStyle;

      // return this.divStyle11
    }
posted @   寒冷的雨呢  阅读(64)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
点击右上角即可分享
微信分享提示