vue
vue过渡 & 动画---进入/离开 & 列表过渡
（1）概述 Vue在插入、更新或者移除DOM时，提供多种不同方式的应用过渡效果。包括以下工具：在CSS过渡和动画中自动应用class可以配合使用第三方CSS动画库，如Animate.css在过渡钩子函数中使用JavaScript直接操作DOM可以配合使用第三方JavaScr...
Vue2.0 —生命周期和钩子函数
咱们从上图可以很明显的看出现在vue2.0都包括了哪些生命周期的函数了。对于执行顺序和什么时候执行，看上面两个图基本有个了解了。下面我们将结合代码去看看钩子函数的执行。ps:下面代码可以直接复制出去执行<!DOCTYPEhtml><html><head><title>&l...
vue组件---动态组件之多标签页面
首先看下效果图 代码： <!DOCTYPEhtml><html><head><metacharset="utf-8"><title>动态&异步组件</title><styletype="text/css">*...
vue组件---边界处理情况
（1）访问元素&组件 ①访问根实例 在每个 newVue 实例的子组件中，其根实例可以通过 $root 属性进行访问。例如，在这个根实例中：//Vue根实例newVue({data:{foo:1},computed:{bar:f...
vue组件---动态组件&异步组件
（1）在动态组件上使用keep-alive 之前曾经在一个多标签的界面中使用 is 特性来切换不同的组件。接下来简单回顾下 <component>元素是vue里面的一个内置组件。在里面使用v-bind:is，可以实现动态...
vue组件---插槽
（1）插槽内容 Vue实现了一套内容分发的API，这套API的设计灵感源自 WebComponents规范草案，将 <slot> 元素作为承载分发内容的出口。 在父级组件里可以这样写<divclass="slot_area"&g...
vue组件---自定义事件
首先简单回顾下组件事件及组件的复用 demo1：按钮事件<divclass="button_area"><button-area></button-area><button-area></button-area>&...
vue组件---组件注册
（1）组件名 在注册一个组件的时候，我们始终需要给它一个名字。比如在全局注册的时候我们已经看到了：Vue.component('my-component-name',{/*...*/}) 该组件名就是 Vue.component 的第一个参数。...
vue基础---表单输入绑定
【一】基础用法 用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇...
vue基础---事件处理
（1）事件监听 v-on 指令监听DOM事件，并在触发时运行JS代码<divclass="event_area">{{message}}<buttonv-on:click="show_info">按钮</button></div>...
vue基础---列表渲染
首先简单回顾下v-for‘指令<olid="list_area"><liv-for="bookinbooks">{{book.name}}</li></ol><scripttype="text/javascript"&...
vue基础---条件渲染
（1）v-if条件渲染 v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回truthy值的时候被渲染。 可以用 v-else 添加一个“else块”： ①表...
vue基础---Class 与 Style 绑定
【一】绑定HTMLClass （1）对象语法 ①普通绑定class<divid="area"v-bind:class="className"></div><scripttype="text/javascript">varvm=newVue(...
vue基础---计算属性和侦听器
【一】计算属性 模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如：<divid="example">{{message.split('').reverse().join('')}}</div&g...
vue基础---模板语法
Vue.js使用了基于HTML的模板语法，允许开发者声明式地将DOM绑定至底层Vue实例的数据。所有Vue.js的模板都是合法的HTML，所以能被遵循规范的浏览器和HTML解析器解析。 在底层的实现上，Vue将模板编译成虚拟DOM渲染函数...
