alpacajs
v0.0.1
Published
一个类（copy）vue的mvvm框架
Readme
alpaca.js
一个类（copy）vue的mvvm框架
注意：这个项目只是我学习vue源码的过程中，为了加深自己的理解和增强动手能力，会仿造vue的源码，撸（chao）出来的框架，改动目前也仅仅是换个变量名（例如Vue换成Alpaca,v-on换成alpaca-on等等），只是用于娱乐，请不要用作生产。
目前已经实现的只有双向绑定和事件绑定
双向绑定
和vue的一样，就是换了个名字而已，示例代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>alpaca.js</title>
</head>
<body>
<div id="app">
<input alpaca-model="msg">
<span>{{msg}}</span>
</div>
</body>
<script src="js/alpaca.js"></script>
<script type="text/javascript">
new Alpaca({
el: '#app',
data: {
msg: 'Alpaca'
}
});
</script>
</html>事件绑定
和vue的一样，就是换了个名字而已，示例代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>alpaca.js</title>
</head>
<body>
<div id="app">
<button alpaca-on:click="del">-</button>
<span>{{num}}</span>
<button alpaca-on:click="add">+</button>
</div>
</body>
<script src="js/alpaca.js"></script>
<script type="text/javascript">
new Alpaca({
el: '#app',
data: {
num: 0,
},
methods: {
add: function () {
this.num = this.num +1;
},
del: function () {
this.num = this.num -1;
}
}
});
</script>
</html>