vue-指令详情及操作

指令

需要大家实际操作去感受一下,多练容易掌握

数据绑定

{{}}和v-text 解析文本  v-html 解析html标签   *  {{}}+-*/,三术运算可用

事件绑定

给标签绑定函数,v-on:click && @click 函数在methods里面 事件中有event对象,函数参数为$event,数据用this操作,如果外部调用$data

其他指令

v-for  v-for="item(字段名,遍历数组指向每个值)  in(of) list(数组json)"

v-model 表单元素实现数据双向绑定v-model="" 表单元素value,需要在vue初始化设置一下

v-if (操作dom元素删除添加)、 v-show(操作dom元素里面的css) 相同显示与隐藏   没v-hide

v-if(>)v-else-if(>&&<)  v-else(<) 三个合用业务逻辑判断,中间不能出现其他dom元素

v-once 一次渲染

v-bind 如果行间样式有属性变量用v-bind:或者简写用后面可以用数组,改变多种样式

类名<:class="{classA:isa}">用布尔值判断用不用 ,对象形式 <:class="{classobj}">

基本组件属性

new Vue=({
el, //要绑定的dom
router,//路由
data,//需要绑定的数据
methods,//定义可以在组件或者模板内的方法
watch,//监听方法,监听到数据改变,需要做对应操作
filter,//过滤
computer,//依赖与别的数据计算出来的数据,name=firstName lastName
})

实例

猜你喜欢

转载自www.cnblogs.com/guqzhoublog/p/11256027.html
今日推荐