vue常用指令复习总结
程序员文章站
2022-05-16 18:44:09
...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!--
### v-bind(简写为":"),用于动态地绑定一个或多个特性，比如class或者style样式等
### v-if 用于判断，在切换元素时，其属性值的true或false相当于创建或销毁该节点
(常用在不会频繁改变显示状态的地方)
### v-for 用于循环遍历渲染数据，用于循环一个数组或者一个对象来渲染列表，
vue2.0以上必须配合key值使用
### v-on 简写为 "@",用于监听指定元素的DOM事件，比如点击事件
### v-model 一般用来实现表单元素和应用状态之间的双向绑定
### v-show 根据表达式的真假值，切换元素的display CSS属性
### v-text 更新DOM对象的textContent
### v-html 更新DOM对象的innerHTML
-->
<div v-for="item in items">
{{ item.text }}
</div>
<!-- item为当前项，index为索引 -->
<p v-for="(item, index) in list">{{item}} -- {{index}}</p>
<!-- item为值，key为键，index为索引 -->
<p v-for="(item, key, index) in obj">{{item}} -- {{key}}</p>
</body>
</html>
上一篇： 根据日期判断是否是节假日