vue.js初学入门教程(1)(2)

<!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>

vue.js初学入门教程(1)

其他:

  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权威指南》

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzggjx.html