Demo class và style bindings trong Vue.js Live code

 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Vue.js Toidicode.com</title>
</head>
<style type="text/css">
    .text-red{
        color: red;
    }
    .border-bottom{
        border-bottom: 1px solid orange;
        padding-bottom: 10px;
    }
</style>
<body style="text-align: center;">
    <div id="app">
        <h1 v-bind:class="[{'border-bottom' : border}, textRed]">Chào mừng bạn đến với website toidicode.com</h1>
    </div>
    <script src="https://unpkg.com/vue@2.4.2" type="text/javascript"></script>
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                border: true,
                textRed: 'text-red'
            }
        });
    </script>
</body>
</html>    
            