美文网首页
2019-02-14 Vue.js 常用指令

2019-02-14 Vue.js 常用指令

作者: chenhbdl | 来源:发表于2019-02-14 11:17 被阅读0次

v-model 一般用在表单元素上(input) 双向数据绑定
循环
v-for 使用 v-for="value in arr" value 为当前使用值得依赖 arr
为数据源
v-for="(k,v) in arr" 此时的arr为json k为key v 为 value
事件
v-on:click(mouseover/mouseout/dblclick.......) 绑定事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <script src="https://unpkg.com/vue/dist/vue.js"></script> <style type="text/css"> .class1{ background-color: red; } </style> <body> <div id="vue_det"> <input type="button" value="提交" v-on:click="add" > <ul> <li v-for="value in arr">{{value}}</li> </ul> </div> </body> <script type="text/javascript"> var vm = new Vue({ el: '#vue_det', data: { arr:["1","2","3"], msg:"合理礼物" }, methods:{ add:function(){ this.arr.push("4"); } } }) </script> </html>

相关文章

  • 2019-02-14 Vue.js 常用指令

    v-model 一般用在表单元素上(input) 双向数据绑定循环v-for ...

  • Vue基础知识介绍

    本节主要介绍Vue.js开发中的常用指令介绍,后续会持续补充 1. vue中常用的v-指令 v-text // 是...

  • 03Vue.js的常用指令

    Vue.js常用指令 使用 v-cloak 要特别注意:因为该指令需要配合样式(style) 才可以生效,如下所示...

  • Vue.js常用指令

    (一)vue常用的指令 1.数据渲染:v-text、v-html、{{}} 2.条件渲染 控制模板隐藏:v-sho...

  • Vue.js 指令与事件

    指令(Directives)是 Vue.js 模板中最常用的一项功能,它带有前缀v-,在前文我们已经使用过不少指令...

  • vue常见函数大全*基础

    VUE.JS常用函数大全 1、目录记忆 2、安装相关 3、内部指令 4、全局API 5、reverse() ; 数...

  • Vue.js(2)----常用指令

    Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。Vu...

  • Vue.js中常用指令

    指令(directive)是带有v-前缀的特殊属性。 vue.js中的循环 (v-for)、判断(v-if / v...

  • vue.js 的常用指令

    v-if v-else v-show 指令 v-if:判断是否加载,可以减轻服务器的压力,在需要时加载。 v-sh...

  • 10-Vue的常用指令

    Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on Vue.js的指...

网友评论

      本文标题:2019-02-14 Vue.js 常用指令

      本文链接:https://www.haomeiwen.com/subject/aswseqtx.html