VUE--插值的操作

一、vue常见的指令

1. v-once：保留第一次渲染结果
2. v-html ：把html代码解析，只显示内容
3. v-pre ：原样输出
4. v-cloak ：解决文本闪烁问题
5. v-text　：显示文本

二、v-bind指令两种写法   作用：动态绑定属性 

1. v-bind:href="url">百度
2. :href="url">百度

1、v-bind动态绑定class(对象语法)

 

    "url" class="title" :class="{active:isActive,line:isLine}">百度
    "url" class="title" :class="getClasses()">百度

2、v-bind动态绑定class:(数组语法)

class="[classaArray ,classaArray2]">{{message}}
class="getClassArray()">{{message}}

*********完整代码************

"en">


    "UTF-8">
    "viewport" content="width=device-width, initial-scale=1.0">
    "X-UA-Compatible" content="ie=edge">
    
    
    

"app">
    "url">百度
    
    "url" class="title" :class="{active:isActive,line:isLine}">百度
    "url" class="title" :class="getClasses()">百度

    
    
class="[classaArray ,classaArray2]">{{message}}
    
class="getClassArray()">{{message}}
    

    "getClass">按钮



    

3、v-bind动态绑定style(对象语法)

    
"{color:color,fontSize:'fontSize'}">{{message}}
    
"getStyle()">{{message}}

4、v-bind动态绑定style(数组语法)

"[baseStyle,baseStyle2]">{{message}}

*******完整代码*******

"en">


    "UTF-8">
    "viewport" content="width=device-width, initial-scale=1.0">
    "X-UA-Compatible" content="ie=edge">
    
    

"app">
    
    
    
"{color:color,fontSize:'fontSize'}">{{message}}
    
"getStyle()">{{message}}

    

    
"[baseStyle,baseStyle2]">{{message}}