Vue2
笑笑是一个码农
Coding
展开
-
Vue2.js学习笔记-01
由于工作中要修改前端Vue写的页面(我可是后端呀。。哭脸),特来学学,本来之前一直想学的,但都只学了点皮毛,这不,机会来了,废话不多说,进入正题! 老规矩,Hello World! 首先去Vue官网下载Vue的js文件,地址:https://cn.vuejs.org/v2/guide/installation.html 用自己喜欢的编辑器创建工作目录,创建HTML文件...原创 2019-06-12 23:51:25 · 172 阅读 · 0 评论 -
Vue2.js学习笔记-04(表单元素数据的双向绑定)
一、回顾上一次我学习了一些常用的事件修饰符,今天要学习的是表单元素数据的双向绑定。二、v-model指令首先要了解,什么是数据的双向绑定,就是当页面上的数据改变时,与其绑定的vue实例的属性的值要同步修改,反之亦然。v-text、v-bind指令都可以将vue实例中的属性的值渲染到对应绑定的表单元素上,当我们修改vue实例属性中的值,会同步修改页面渲染的值,但反之,不会修改vue实...原创 2019-06-19 09:49:15 · 1040 阅读 · 0 评论 -
Vue2.js学习笔记-02(基本指令v-cloak、v-text、v-html、v-bind、v-on学习)
一、回顾在vue的Hello World程序的学习中,页面获取值的表达式为“{{}}”, 但这个插值表达式会存在一定的问题,当我们网速很慢的情况下,页面会优先渲染"{{ 数据所对应的key }}",怎么看到这个效果呢,F12打开谷歌浏览器的开发者工具,按照下图把网络设置为3G然后把如下代码放入到html文件中,在浏览器打开<body> <div id=...原创 2019-06-15 16:05:52 · 674 阅读 · 0 评论 -
Vue2.js学习笔记-03(事件修饰符)
一、回顾在上次的学习过程中,学到了一些vue指令的基本用法,其中v-on指令可以进行事件的绑定,针对这个指令,还有其他的一些修饰符,这是我今天的学习内容。二、事件修饰符常用的事件修饰符主要有:.stop 阻止事件冒泡.prevent 阻止默认事件.self 事件作用于元素自身时触发.once 事件只触发一次.cap...原创 2019-06-18 16:47:38 · 210 阅读 · 0 评论 -
Vue2.js学习笔记-05(通过属性绑定添加样式)
一、回顾上次学习了v-model对表单元素的双向绑定,无需人为操作dom,无论是修改了页面上的值,还是vue实例中属性的值,都会同步修改另一方的值。今天学习的内容是通过属性绑定为元素添加样式。二、通过属性绑定添加样式练习代码如下:<html lang="en"><head> <meta charset="UTF-8"> <...原创 2019-06-23 10:11:49 · 332 阅读 · 0 评论 -
Vue2.js学习笔记-06(v-for指令迭代数组、对象数组、对象、数字)
一、回顾上一次学习了通过属性绑定为元素添加样式,今天主要学习v-for指令的迭代操作。二、v-for指令学习学习代码如下:<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ini...原创 2019-06-29 20:58:37 · 1067 阅读 · 1 评论