郑州网站建设,郑州网站制作,郑州做网站,巩义网站建设,荥阳网站建设,偃师网站制作-全栈网络

网站建设之vue.js常见命令及方法归纳总结(2)
当前位置:首页 > 建站技巧 > 网站代码 >

网站建设之vue.js常见命令及方法归纳总结(2)

时间: 2018-11-22 分类: 网站代码 浏览次数:

之前我们整理了一篇关于vue的常见命令及方法,实际在网站建设开发中,这些指令在项目开发中经常被灵活使用,因此,全栈网络又整理了一篇关于vue基础语法及指令的内容,供大家参...

之前我们整理了一篇关于vue的常见命令及方法,实际在网站建设开发中,这些指令在项目开发中经常被灵活使用,因此,全栈网络又整理了一篇关于vue基础语法及指令的内容,供大家参考。

网站建设之vue.js常见命令及方法归纳总结(2)

一.vue基础模板语法:
语法:<any> {{data数据中声明的变量}} </any>
说明:在创建vue实例化对象之后,就需要绑定data数据,然后通过两个花括号将data数据对应需要替换的部分输出在html文档中,注意在属性绑定中,无须添加两个花括号
实例:
1. <div>{{表达式}}</div > 
2. <div v-text=‘变量’></div >

二.vue之v-for数据循环语法:
语法:<div v-for='item in items'></div >
说明:通过v-for数据循环语法可以实现数据获取之后的列表数据展现,
扩展语法:<div v-for='(item,index) in items'></div >(进行index序列号的绑定)

三.vue之vue-if属性判断显示隐藏指令
语法:<div v-if='表达式'></div>
作用:根据表达式执行结果的真假,来决定该html元素是否要在当前页面中存在,同样用法的还有v-show,不过v-show的真假决定了html元素的显示与隐藏
扩展语法:<div v-else-if='表达式'><v-o/div>

四.vue之v-on函数事件的绑定  
语法:<div v-on:click='click()'></div>
作用:v-on通过为指定的元素绑定不同的鼠标或者键盘事件,并通过对应的函数进行调用,同时v-on:click支持简写为:@:click,如下
简写:<div @click='click()'></div>

五.vue之v-bind属性绑定方法
语法:<a v-bind:href='aLink'></a>
作用:v-bind可以对网站中html元素进行其属性,类名等多种内容的数据绑定并通过data进行数据重新赋值。
简写:<a :href='aLink'></a>

六.vue之v-model数据双向绑定
语法:    <input type="text" v-model="绑定内容">
作用:将输入框等一系列html元素的内容用v-model进行绑定,用户可以随时获取表单元素中的数据并进行操作

以上就是关于vue中常用的一些属性及方法的使用介绍,基础用法是每一门语言的核心内容,希望大家多多揣摩,全栈网络专业从事郑州网站建设,欢迎大家随时咨询。
本文关键词: vue 未经允许不得转载:郑州网站建设|郑州网站制作|荥阳网站建设|巩义网站建设|网站优化-全栈网络



Copyright © 2017-2020 版权所有:全栈网络工作室 备案号:豫ICP备17039206号-1 HTML网站地图
郑州网站建设|郑州网站制作|郑州做网站|巩义网站制作|荥阳做网站|偃师网站制作-全栈网络