<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <ul> <li v-for="user in users | orderBy field reverse">{{user.name}}</li> </ul> <script src="https://www.jb51.net/js/vue.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var demo = new Vue({ el:'body', data:{ field:'tag', reverse:false, // 颠倒 users:[ { name:'快车', tag:'2' }, { name:'慢车', tag:'3' }, { name:'好车', tag:'1' }, { name:'破车', tag:'0' } ] } }) </script> </body> </html>
其他:
v-bind指令可以缩写为一个冒号,v-on指令可以缩写为@符号。
v-model指令后面可以添加number、lazy、debounce参数。
Number可以将用户的输入转换为Number类型(如果原值的转换结果为NaN,则返回原值)。
在input中时添加lazy将数据改到在change事件中发生。
Debounce可设置延时。
参考:大神写的:https://www.jb51.net/article/96426.htm《vue.js权威指南》