随笔分类 -  Vue v-指令

摘要:表单绑定 表单控件在实际开发中是非常常见的。特别是对于用户信息的提交,需要大量的表单 Vue中使用v-model指令来实现表单元素和数据的双向绑定 <div id="app"> <input type="text" v-model="message"> {{message}} </div> <scr 阅读全文
posted @ 2020-03-05 15:49 懒惰ing 阅读(648) 评论(0) 推荐(0) 编辑
摘要:v-for遍历数组 渲染一组数据的时候用 v-for v-for的语法类似于JavaScript中的for循环 格式如下:item in items的形式 我们来看一个简单的案例: 如果在遍历的过程中不需要使用索引值 v-for="movie in movies" 依次从movies中取出movie 阅读全文
posted @ 2020-03-04 15:03 懒惰ing 阅读(16399) 评论(4) 推荐(1) 编辑
摘要:条件判断 v-if和v-else <div id="app"> <div v-if="score>=90">优秀</div> <div v-else-if="score>=80">良好</div> <div v-else-if="score>=60">及格</div> <div v-else>不及格 阅读全文
posted @ 2020-03-04 14:38 懒惰ing 阅读(3525) 评论(0) 推荐(0) 编辑
摘要:事件监听 v-on介绍 在前端开发中,我们需要经常和用于交互。这个时候,我们就必须监听用户发生的时间,比如点击、拖拽、键盘事件等等 在Vue中如何监听事件呢?使用v-on指令 作用:绑定事件监听器 缩写:语法糖 @ 预期:Function | Inline Statement | Object 参数 阅读全文
posted @ 2020-03-04 14:33 懒惰ing 阅读(4836) 评论(0) 推荐(0) 编辑
摘要:v-bind基础 用于绑定一个或多个属性值,或者向另一个组件传递 props 值 比如通过Vue实例中的data绑定元素的src和href,代码如下: <div id="app"> <img v-bind:src="imgSrc" alt=""> <a v-bind:href="link">Vuej 阅读全文
posted @ 2020-03-04 13:33 懒惰ing 阅读(381) 评论(0) 推荐(0) 编辑
摘要:插值表达式的使用 将 data 中的文本数据,插入到HTML中可以通过 Mustache 语法(也就是双大括号),数据是响应式的 <div id="app"> <h2>Hello {{message}}</h2> <h2>{{firstName}} {{lastName}}</h2> <h2>{{n 阅读全文
posted @ 2020-03-04 12:20 懒惰ing 阅读(1091) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示