Vue模板的操作方法

穿精又带淫゛_ 提交于 2020-02-17 15:29:45

View就是View模板,HTML视图,DOM结构

v-if:确定元素是否在视图中存在

在这里插入图片描述
在这里插入图片描述
v-if 控制视图是存在,来控制元素是否存在,如果显示为false,在Dom节点中就不存在,找不到该元素。
v-if =""的值放的就是 data里面的数据。

v-show:确定元素是否显示,用display设置样式block为显示,none为隐藏。

在这里插入图片描述
在这里插入图片描述
v-show通过控制Dom节点的display样式,block为显示,none为隐藏,但是存在于节点中。

v-bind:绑定属性,添加动态值时。

v-bind:href="links“ => :href=“links”

在这里插入图片描述

v-once:当数据改变时,插值处的内容不会更新

v-for :使用item in items,用循环数组,遍历数组的索引值

  • {{item.username}}
  • {{index}}{{item.username}}
  • 索引值从0开始 ![查询从0开始的数组数据](https://img-blog.csdnimg.cn/20200217132950495.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2NhaW5pYW95c2E=,size_16,color_FFFFFF,t_70)
    标签
    易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
    该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!