WildVue
Vue.js 与野狗的绑定插件
安装
- 如果使用
<script>
全局引入: 如果Vue
存在会自动安装。
<!-- Vue --><!-- Wilddog --><!-- WildVue -->
- 在模块化环境中,比如CommonJS
npm install vue wilddog wildvue --save
var Vue =var WildVue =var wilddog =// 在模块化环境中需要使用 user 安装Vue
使用
var wilddogApp = wilddogvar sync = wilddogAppvar vm =el: '#demo'wilddog://简单语法//默认作为数组绑定anArray: sync// 也可以绑定一个查询// anArray: sync.ref('url/to/my/collection').limitToLast(25)// 完整语法anObject:source: 'url/to/my/object'// 可选,作为对象绑定asObject: true// 可选,提供一个回调{}
{{ anObject | json }}{{ item.text }}
上面的例子会绑定一个Vue实例的anObject
和 anArray
到相应的 Wilddog 数据源。另外,Vue实例也可以使用 $wilddogRefs
property:
// add an item to the arrayvm$wilddogRefsanArray
另外,你也可以使用 $bindAsObject
或 $bindAsArray
方法绑定一个Wildog ref:
vmvm
数据归一化
数组绑定
在绑定数组中的每一条记录中都会包含一个 .key
property,用来表示这条记录的key。 所以,如果你有书记在 /items/-Jtjl482BaXBCI7brMT8/
, 这条记录会存在一个 .key:"-Jtjl482BaXBCI7brMT8"
。
如果value是简单数据类型(boolean,string,number)会保存在.value
property 中。如果value 是对象,value对象中每个property 都会直接存放在记录中:
The resulting bound array stored in vm.items
will be:
贡献
Clone the repo, then:
$ npm install # install dependencies $ npm test # run test suite with coverage report $ npm run dev # watch and build dist/wildvue.js $ npm run build # build dist/wildvue.js and wildvue.min.js