D_COIS
2021-07-14 17:45
采纳率: 66.7%
浏览 118
已采纳

vue中如何根据数据动态绑定样式

如题:vue中如何根据数据(假数据数组对象dataStatus中,有一项数据status)动态改变样式,若status值为'正常',div的背景颜色为蓝,若status值为异常,div背景颜色为红

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

4条回答 默认 最新

  • 大脑空白想不到id 2021-07-14 17:58
    已采纳

    绑定style

    <div :style="status==1?{backgroundColor:'red'}:''">
    

    或者绑定class

    <div :class="status==1?'red':''">
    

    需要定义类名样式

    .red{
      background-color:red;
    }
    
    已采纳该答案
    评论
    解决 1 无用
    打赏 举报
  • 可以用v-if和v-else两个标签 或者:class="status=="正常"?'classblue':'classred'" 三元运算 再或者
    :style="{color:status=="正常"?"blue":"red"}"

    评论
    解决 1 无用
    打赏 举报
  • qq_45713941 2021-07-14 17:58

    :class="isShow ? 'item1' : 'item2'"

    评论
    解决 无用
    打赏 举报
  • D_COIS 2021-07-14 18:48

    img

    img
    欧克搞定

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题