zoukankan      html  css  js  c++  java
  • vue 零散记录

    绑定class——对象语法和数组语法

    对象语法: v-bind:class 可以与 class attribute 共存

    class="red"
    v-bind:class={active: isActive,'class-name':isShow}
    

    绑定的数据可以存放在data 中,也可以放在计算属性中
    数组语法: 数组语法中也可以使用对象语法

    v-bind:class="[className1,className2, className3 ? className3 : '']"
    v-bind:class="[className1,{active: isActive}]"
    

    class属性也可以添加到组件上,等于追加

    绑定内联样式

    对象语法

    :style="{background:color,top:number+'px'}"
    

    直接绑定到一个对象上更好,让模板更清晰,也可以绑定在计算属性中

    :style="styleObject"
    data() {
          return {
                styleObject:{
                      color: 'red',
                      fontSize: '12px' 
                }
          }
    }
    

    数组语法--可以将多个样式对象应用到统一元素

    :style="[styleObject1,styleObject2]"
    
  • 相关阅读:
    新的知识点
    知识点
    9.14知识点
    列表内容
    css的背景和边框
    css的text和font
    css
    js 第一天
    浏览器的差距
    布局
  • 原文地址:https://www.cnblogs.com/geek12/p/13734217.html
Copyright © 2011-2022 走看看