Vue js test

by Jayson Buquia

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.12.16/vue.min.js"></script>
<div id="test">
    <h3 id="test" v-text="title" v-on="click:clickHandler">    
</h3>
    <input type="text" v-model="title">
        
        <ul>
            List:
            <li v-repeat="list">
                {{ $value | capitalize }}
            </li>
        </ul>
            <li class="obj" v-repeat="object">
                {{ $key }} : {{ $value }}
            </li>
        <ul>
            
        </ul>
</div>

JavaScript

var $el = $('#test'),
    data = {
    	title : 'Vue Test',
        clickHandler : function(){
        	console.log('clicked');
        },
    list : [
    	'one',
        'two',
        'three'
    ],
        object : {
        	name : 'Sample Object',
            subtitle : 'This is a subtitle',
         number : 100,
            boolean: false
        }
    };

var vm = new Vue({
	el 		: '#test',
    data	: data
});

vm.$set('title','This is another title');

vm.$data.list.push('Another Item');
vm.$data.list.push({name:'Dummy Object'});

vm.$set('object.added','Added content');