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
}
择善人而交,择善书而读,择善言而听,择善行而从。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通