![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
一笑而过者也
爱好java,分布式开发
展开
-
vue04-局部组件
首先看代码:<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&原创 2018-09-23 10:47:55 · 122 阅读 · 0 评论 -
vue14-修改数组值触发vue绑定值改变
首先看下面这段代码:<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&原创 2018-09-24 11:24:04 · 10442 阅读 · 0 评论 -
vue15-修改对象值触发vue绑定改变
首先看下面代码:<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&am原创 2018-09-24 11:34:24 · 5041 阅读 · 0 评论 -
vue18-操作dom ref
首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&qu原创 2018-09-24 12:00:02 · 202 阅读 · 0 评论 -
vue19-获取子组件引用 ref
下面代码是一个计数器的功能,首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src=&原创 2018-09-24 12:09:41 · 5497 阅读 · 0 评论 -
vue20-父子组件传值
下面代码是一个计数器的代码,父组件把初始值传给了子组件,子组件接收后,+1时,又把加的步长传给了父组件,在父组件中显示的总和。<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world<..原创 2018-09-24 12:24:12 · 135 阅读 · 0 评论 -
vue01-helloWorld创建vue实例
首先打开vue官网,打开教程,根据下面连接把js文件下载下来,也可以用网址不下载。<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title>原创 2018-09-22 22:12:06 · 2490 阅读 · 0 评论 -
vue02-数据双向绑定
首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&qu原创 2018-09-23 10:07:10 · 134 阅读 · 0 评论 -
vue03-全局组件
首先看下面代码<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&原创 2018-09-23 10:42:18 · 187 阅读 · 0 评论 -
vue17-子组件定义data属性
看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js"原创 2018-09-24 11:37:46 · 2315 阅读 · 0 评论 -
vue16-is属性
首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&qu原创 2018-09-24 11:36:16 · 832 阅读 · 0 评论 -
vue13-解决标签复用问题
首先看下面代码<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&quo原创 2018-09-24 09:54:42 · 1561 阅读 · 0 评论 -
vue05-生命周期
首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&qu原创 2018-09-23 11:08:13 · 102 阅读 · 0 评论 -
vue06-三种数据绑定方式
<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>三种模板语法</title> <script src="vue.js">&原创 2018-09-23 11:16:12 · 1581 阅读 · 0 评论 -
vue07-计算属性/方法/侦听器
有一个场景,我们定义两个变量firstName,lastName,要自动计算出fullName。1.我们可以用method方法计算,如下面代码,这样有一个缺点,每次调用都要计算,firstName与lastName没有修改,也需要计算才能拿到fullName<!DOCTYPE html><html lang=en><head> <m...原创 2018-09-23 11:36:57 · 145 阅读 · 0 评论 -
vue08-computed get与set方法
上篇博客,只用了computed的get方法,获取计算属性的值。set方法为给计算属性赋值时执行的方法<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> &原创 2018-09-23 11:42:18 · 443 阅读 · 0 评论 -
vue09-class对象样式绑定
首先看代码<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&l原创 2018-09-23 11:56:59 · 121 阅读 · 0 评论 -
vue10-class数组样式绑定
首先看代码<!DOCTYPE html><html lang=en><head> <meta charset="utf-8" /> <title>Hello world</title> <script src="vue.js">&l原创 2018-09-23 12:21:46 · 4262 阅读 · 0 评论 -
vue11-内联样式绑定
首先看代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js"原创 2018-09-23 12:26:03 · 190 阅读 · 0 评论 -
vue12-v-if与v-show
首先看下面代码:<!DOCTYPE html><html lang=en> <head> <meta charset="utf-8"/> <title>Hello world</title> <script src="vue.js&qu原创 2018-09-24 09:54:29 · 138 阅读 · 0 评论 -
21$emit与$on
emit与emit与emit与on$on $emit应用场景子组件中触发在父组件中定义的方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ...原创 2019-05-05 23:02:39 · 1098 阅读 · 0 评论