vue学习
关注
分享
扫一扫
dream21st
这个作者很懒，什么都没留下…
展开
-
vue学习（一）
1，进入vue的官网 http://doc.vue-js.com/v2/guide/installation.html2，下载开发版的vue.js3,新建项目study-vue01 将vue.js放入到项目中index.html中的内容如下 <!DOCTYPE html><html lang="en"><head>...原创 2018-11-04 21:41:03 · 170 阅读 · 0 评论 -
vue学习(十六)动态组件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js">&l原创 2018-11-05 22:55:53 · 151 阅读 · 0 评论 -
vue学习（十五）作用域槽
1，作用域槽需要使用template <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js原创 2018-11-05 22:55:42 · 125 阅读 · 0 评论 -
vue学习（十四）slot学习
1，在自定义组件中，参入响应的标签 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js&原创 2018-11-05 22:55:23 · 189 阅读 · 0 评论 -
vue学习（十三） 发布订阅通讯
1，参考例子，非父子组件之间的通讯 ，两个child组件之间通过bus总线来完成 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <原创 2018-11-05 22:55:31 · 208 阅读 · 0 评论 -
vue学习（十二）给组件绑定原生事件
1，例子如下 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"&g原创 2018-11-05 07:55:25 · 197 阅读 · 0 评论 -
vue学习（十一） 父子组件间传值
1，示例代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"&g原创 2018-11-05 07:19:03 · 121 阅读 · 0 评论 -
vue 学习（十）ref的用法
1，例子是一个计数器，就是求两个数之和 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.j原创 2018-11-04 22:46:39 · 195 阅读 · 0 评论 -
vue学习（九） set用法
1，示例代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"&g原创 2018-11-04 21:43:57 · 261 阅读 · 0 评论 -
vue学习吧（八） v-if（v-else-if v-else） v-show
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js">&l原创 2018-11-04 21:43:50 · 152 阅读 · 0 评论 -
vue学习（七） class和style学习
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js">&l原创 2018-11-04 21:43:42 · 125 阅读 · 0 评论 -
vue学习(六) computed的get和set方法
1，测试代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"&g原创 2018-11-04 21:43:34 · 231 阅读 · 0 评论 -
vue学习（十九） 动画
1，vue结合velocity.js现实动画 http://velocityjs.org/ <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue中的 Js 动画与 Velocity.js 的结合<原创 2018-11-06 22:48:36 · 124 阅读 · 0 评论 -
vue学习（五） watch computed
使用技术属性和监听属性会自带缓存，当依赖的属性发生变化时，才会重新生成 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <scr原创 2018-11-04 21:43:26 · 114 阅读 · 0 评论 -
vue学习（四） v-text v-html学习
1，代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js">原创 2018-11-04 21:43:11 · 157 阅读 · 0 评论 -
vue学习（三）vue的生命周期
1，vue的生命周期图2，生命周期的方法beforeCreate created beforeMount mounted beforeUpdate updated activated deactivated beforeDestroy destroyed3，生命周期测试代码 <!DOCTYPE html><html lang="en"...原创 2018-11-04 21:43:01 · 178 阅读 · 0 评论 -
vue学习（二） 做一个简单的toDoList
一，最直接的代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>To do List</title> <script src="vue.js"原创 2018-11-04 21:42:39 · 299 阅读 · 0 评论 -
vue学习（十八） animate.css使用
1，下载animate.csshttps://daneden.github.io/animate.css/ 2,代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</tit原创 2018-11-06 08:02:12 · 178 阅读 · 0 评论 -
vue学习(十七) transition
1，最初的只是隐藏和展示 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.js"原创 2018-11-06 07:31:46 · 147 阅读 · 0 评论