scv event bind - JSFiddle - JSFiddle

by understore

HTML

<script src="https://unpkg.com/[email protected]/dist/scv.min.js"></script>
<div id="counter"></div>

CSS

num{display:block}

JavaScript

var tpl = "\
<div>\
	<span>{ this.num }</span>\
    <input type='button' @click='incNum' value='증가'>\
    <input type='button' @click='decNum' value='감소'>\
</div>\
";

var incNum = function(option){
    var item = Scv.getItem({
        id : option.id,
        idx : option.idx
    });

    var n = !item.data ? 0 : item.data.num + 1; 
    
    Scv.setItem({
    	id : option.id,
        idx : option.idx,
        data : {num : n}
    })

}

var decNum = function(option){
    var item = Scv.getItem({
        id : option.id,
        idx : option.idx
    });
    var n = !item.data ? 0 : item.data.num - 1;

    Scv.setItem({
    	id : option.id,
        idx : option.idx,
        data : {num : n}
    })
}

Scv({
	id : "counter",
    template : tpl,
    target : document.querySelector("#counter"),
    data : {
    	num : 0
    },
    events : {
    	incNum : incNum,
      decNum : decNum
    }
})