v-bind is a need for a binding class name

v-bind binding css style binding label display shows whether or not to form a
<p: class = "[ ' bg', 'dx', { 'lin': falg}]"> {{msg}} </ p>

<p: class = "{bg : true, dx: true, lin: true}"> {{msg}} </ p> Such bad because writing dead

Class names for dynamic binding is no longer the number} {} {

 

lin is true, this class name binding lin

 

 <style>
        .bg {
            background: pink;
        }

        .dx {
            font-size: 30px;
        }

        .lin {
            color: #ffffff;
        }
    </style>

    <div id="app">
        <p :class="['bg','dx', {'lin':falg}]">{{ msg }}</p>
        <- <p:! Class = "[ 'bg', 'dx']"> {{msg}} </ p> binding two class name ->
    </div>



    <script>
        was vm = new Vue ({
            on: '#app' ,
            data: {
                msg: 'We are good students' ,
                falg: true
            }
        })
    </script>

 

 

 

 

 

 

Guess you like

Origin www.cnblogs.com/IwishIcould/p/11762366.html