Vuelogo Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。 Vue.js 是世...Harry Xiong小于 1 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
1.Vue简介Vue 简介 1.1 Vue 的特性 Vue 是一套用于构建用户界面的渐进式框架,与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用,Vue 拥有以下特性: 组件化思想; 模板的使用和数据渲染非常灵活,层次结构鲜明; 简单的语法并能够简单快速构建一个项目; 轻量级,体积小渲染速度更快; Vue 采用的脚手架工具为 vue-cli; 初期是尤雨...Harry Xiong大约 3 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
10.过滤器过滤器 Vue 可以通过自定义过滤器,将需要的文本格式化输出 注意: 过滤器只能写在插值表达式或者 v-bind 表达式中,并且过滤器需要添加到要添加的 JS 表达式的后方并用管道符|分割; 每个过滤器函数会将接收到的表达式作为函数内部的第一个参数,如果在使用时传入参数,那么传入的参数会依次成为第二个第三个等参数; 多个过滤器可以进行串联操作,将传入的...Harry Xiong大约 1 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
11.自定义指令自定义指令 自定义指令可以通过全局或局部的方式创建,在使用时需要在前面加上 v-的标识符表示时一个指令 11.1 全局指令 通过全局的 Vue 的 Vue.directive()可以创建一个能用在整个 Vue 实例内的指令 11.2 局部指令 通过局部创建的 directives 属性可以创建多个内部的指令,该指令只能用在自身的 Vue 实例中 11....Harry Xiong大约 4 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
12.组件组件 12.1 组件的定义 组件的出现是为了拆分 Vue 实例的代码量,能够让我们以不同的组件来划分不同的功能模板,将来需要什么样的功能,只需要调用对应的组件就可以了 组件化与模块化的区别 模块化是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一; 组件化是从 UI 界面的角度进行划分的,前端的组件化是为了方便 UI 组件的重用...Harry Xiong大约 8 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
13.组件之间的通信方式组件之间的通信方式 13.1 props 父子组件间通信的基本方式 属性值的 2 大类型: 一般: 父组件-->子组件 函数: 子组件-->父组件 隔层组件间传递: 必须逐层传递(麻烦) 兄弟组件间: 必须借助父组件(麻烦) 13.1.1 声明 在组件内声明所有的 props 1. 方式一: 只指定名称 props:['name','age',...Harry Xiong大约 5 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
14.Vue-RouterVue-Router 14.1 路由的定义 后端路由:对于普通的网站,所有的超链接都是 URL 地址,所有的 url 地址都对应服务器上对应的资源; 后端路由是处理请求的回调函数 前端路由:对于单页面应用程序来说,主要通过 URL 中的 hash(#号)来实现不同页面之间的切换,同时,hash 有一个特点:HTTP 请求中不会包含 hash 相关的内容...Harry Xiong大约 14 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
15.VuexVuex 15.1 Vuex 理解 Vuex 是一个全局的共享存储区域,相当于是一个数据仓库 Vuex 是为了保存组件之间的共享数据而诞生的,如果组件之间要有共享数据,可以直接挂载到 Vuex 中,而不必通过父子组件直接的传值了,而私有的数据则不需要挂载到 Vuex 中,只有需要共享的数据才放在 Vuex 中,私有的数据只需要放在组件的 data 中即...Harry Xiong大约 7 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
16.对象数组更新对象数组更新 16.1 Vue.set 16.2vm.\$set 16.3 Vue.set 与 vm.\$set 向响应式对象中添加一个属性,并确保这个新属性同样是响应式的,且触发视图更新。它必须用于向响应式对象上添加新属性,因为 Vue 无法探测普通的新增属性 数组添加; Vue 中的 data 中的数组可以通过 Vue 返回后的实例进行改变,所拥有...Harry Xiong大约 2 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析
17.MixinsMixins 17.1 使用场合 混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项 Mixins 是一种分发 Vue 组件中可复用功能的非常灵活的一种方式。页面的风格不用,但是执行的方法和需要的数据类似就可以选择使用混入 混合对于...Harry Xiong大约 3 分钟Web 前端VueMVVMVuexVue-routerVue 源码分析