默守的博客

概述我们已经知道，现在的web应用及其页面，基本都是由各个组件组合形成，那么这个时候我们【如何较好的组合各个组件】就成为了我们需要关心的问题了场景想象下，对于各个组件组合使用的场景，如果我们要在布局组件中包裹三个组件： 导航组件、内容组件、页脚组件这时，我们该如何实现？我们只能在定义布局组件时就引入这三个组件！问题如果这样实现的话，先不说可扩展性，就是万一哪天我们这三个组件的名字变了...

VUE要学的内容1.基本使用（概览）2.指令（控制视图层，V层）3.Vue实例对象内容（M层）4.Vue组件（复用开发）5.Vue+webpack开发6.必须模块（vue-router, vuex）安装VUE①　使用方式1.通过script标签引入使用 【适合小型的简单应用】2. 以【npm+webpack+单页】形式引入使用 【适合大型的复杂应用】3.通过vue-cli安装...

步骤(1)创建一个网页模板（承载整个应用）(2)引入vue.js文件 （使用vue框架代码）(3)在body中添加一个div（视图V层）(4)在div后面增加script代码 （数据模型M层）(5)完整代码(6)运行效果(7)VM层体现数据模型层M与视图层V双向绑定，自动刷新。在这里我修改了下message的值，然后左侧页面自动刷新修改。第一个vue应用说明从上...

安装Vue DevtoolsVue Devtools是一个在谷歌浏览器上调试vue应用的神器，能提高不少我们在浏览器上开发调试vue程序的效率。（本质上是谷歌浏览器的一个插件）①　vue devtools 下载这是编译好可以直接使用的vue devtools 浏览器插件链接：https://pan.baidu.com/s/1OLOmVl0WkkqbAIqoxACeiQ 提取码：29bn...

1.前言在第一个vue应用中，我们说明了如何在网页模板中插入变量即：{{ 变量名 }}但是这种插入和innerText很像，即使我们插入一个网页标签，他也只会渲染位普通的文本，而不会像innerHTML一样渲染如：那么这里我们就来讲讲如何在网页模板以各种形式插入变量值。2. {{ }} ：插入与绑定文本 （类似与innerText）插入文本就是我们前面讲：{{…}}（双大括号），这...

(1)基本指令①　v-cloak 【编译完成就销毁】a.作用v-cloak指令并没什么明显的作用，不过他会在随着vue实例结束编译时，从绑定的html元素上移除。b.写法直接将他写在标签上就可以了，不需要给他赋任何值，类似于h5中的一些不需要写值的属性。c.用途虽然这个标签本身没什么用，但是由于它具有【随着vue实例结束编译时，从绑定的html元素上移除】的特征，所以我们可以解决如下...

(1)El 元素节点(2)Data 数据集合(3)Methods 方法集合前三个基本上已经讲了，我们直接来看实例对象的计算属性(4)Computed 计算属性1)什么是计算属性1.计算属性即computed, 和前面我们讲的methods方法基本上一样。他们的写法都是函数形式。2.不同的是，methods选项里面的是真正的函数，代表的是一段程序代码的集合，而写在computed的虽然...

1)概念每个 Vue 实例在被创建时都要经过一系列的初始化过程，即生命周期阶段。如 : 创建vue实例----》渲染实例—》更新vue实例----》销毁vue实例然后在这个过程中会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。2)生命周期钩子函数1.准备创建实例 beforeCreate2.创建实例3.创建实例完成 created4.准备渲染实例 ...

1)学习组件的原因概述组件是vue.js最核心的功能，也是整个框架设计最精彩的地方，当然也是最难的地方。原因Vue.js的组件就是为了提高代码重用性和高扩展性的，特别是将ui与js作为一个整体进行复用与扩展。一些具体的场景1.UI构建----》粘贴到其他地方------》所有的ui都修改某处？应用项目的组成2)组件的基本用法和创建一个vue实例需要创建后才能使用类似，组件也需要...

(1)为什么使用props前面我们实现了通过组件把模板内容进行复用，这是不错的事情，但是我们却不希望在任何地方任何时候组件都是都是那样的一层不变。我们更希望在不同的情况下，组件有不同的展现，这样它才是有趣的，更让我们喜欢的。而要实现这个需要，就需要使用props了，他能让组件如同我们所知的js函数一样，在被使用时能够接收参数，并根据参数有不同的展现。(2)使用props流程【数组形式】要...

(1)vue地位①　Vue为全球使用量最多的最流行的两大前端框架之一。另一个为react。②　在世界范围内，react应该略多于vue。③　在中国范围内，两者相差不大，甚至vue的流行程度还要略多于react框架。(2)vue.js的最新版本?最新版本：v2.5.17Github托管地址: https://github.com/vuejs/vue/releases技术栈：https:...

①　解耦数据与视图（mvvm,只关心数据即可，vue会让视图自动同步）②　可复用组件（类似于js函数，但更强大，把网页ui也封装了，且可复用）③　前端路由（类似于nodejs路由，用户发起不同操作，渲染不同ui组件,提高性能）④　状态管理（应用的每一刻都是一个状态，这些状态能够在vue中有效的管理起来）⑤　虚拟DOM（虚拟DOM有效降低大面积真实DOM节点的重绘与排版，只渲染局部...

1)递归组件类似于js函数可以递归一样，组件也可以递归调用，即自己调用自己。要实现组件递归，过程如下：1.第一步：给组件本身加上一个name属性2.第二步：当然为了递归时不会无限的执行下去，你必须加一个结束条件来限制递归数量。3.第三步：实现一次调用注意：其实name可以和组件名不一样，但是name的值和递归调用时必须一样。然后他能用在一些级联选择器和树形控件上。2)内联组件...

1)$nextTick在vue中，dom的更新是采取异步更新队列的，即vue数据变了并不会立即就修改Dom,而是开启一个队列，并缓冲在同一事件循环中发生的所有数据改变。在缓冲时会去掉重复数据，避免不必要计算和DOM操作。所以，在一个事件里面我们通过修改vue实例里面的数据，然后去获取此数据对应的DOM相关内容是获取不到的。【当然，按照vue的核心思想：数据驱动DOM，我们不应该去操作DOM...

1.简介除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。注意，在 Vue2.0 中，代码复用和抽象的主要形式是组件。然而，有的情况下，你仍然需要对普通 DOM 元素进行底层操作，这时候就会用到自定义指令。可以说组件是对UI层的复用，自定义指令是控制层与行为层的复用2.指令的注册自定义指令和组件注册的方法很相似，也分为全局注册和局部注册。全局...

概述1.混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。2.混入和组件是多对多的关系（一个混入对象可作用到多个组件或实例上，多个混入对象也可作用到一个组件或者实例上）3.混入对象可以包含任意组件选项。（methods或data或钩子函数...）4.当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。例子：选项合并当组件和混入对象含有同名...

概述Vue 在插入、更新或者移除 DOM 时，我们能实现这之间转换的过渡效果。然后这些过渡效果是在dom操作（插入、删除）正式应用之前执行。注意：更新就等于重新插入的操作。实现方式1.使用vue内置的class类名,我们直接在当前类下写样式。2.在过渡钩子函数中使用 JavaScript 直接操作 DOM3.可以配合使用第三方 CSS/JS 动画库,如 Animate.css,Ja...

1.Render函数Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML模板。然而在一些场景中，你真的需要 JavaScript 的完全编程的能力，这时你可以用 render 函数，它比 template 更接近编译器。实际上: Vue 的模板实际是编译成了 render 函数。一个最简单的render函数使用Render函数使用场景让我们深入一个简单的例子，这个...

(1)什么是vue插件就像我们安装vscode的插件能给我们的vscode添加不同的功能一样。Vue的插件就是能够给vue添加新功能新特性的东西。(2)Vue插件有什么用插件通常会为 Vue 添加全局功能。所谓全局：即不需要像组件那样，每次使用他前都需要先引入一次。对于插件只要在最开始引入一次，在任何组件就可以直接使用。（类似于我们在window上添加的方法属性那样，任何地方都可以用）...

①　视频介绍https://player.youku.com/embed/XMzMwMTYyODMyNA==?autoplay=true&client_id=37ae6144009e277d②　核心概念Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。具有简单小巧的核心，简单小巧的核心，渐进式技术栈，足以应付任何应用。解释：1.简单小巧是指：v...

①　概述Vue.js在设计上采用mvvm模式进行设计，mvvm模式刚出来时一度的被人奉为神一般的模式，好像不懂mvvm模式就脱离了时代一样。②　什么是mvvm模式呢？Mvvm的全称为：Model、View、ViewModel，m表示数据模型层 , v表示视图层 , vm表示视图模型控制层③　以一个网页为例说明mvvm如果我们有一个数组要渲染到网页中去，那么在其中：数据层M即为数组，视...

(1)概述所谓组件间的通信，实际上就是指在各个组件间，进行参数或者信息的相互传递。比如我们前面学的通过props给子组件传参，实际上这就是父组件向子组件进行单向的通信。(2)组件间通信的几种方式1.父到子的通信父到子的通信使用我们前面使用的props即可。2.子到父的通信父子组件的概念父组件：主动发起调用的哪一方。父组件一般可以给子组件传参子组件：被调用的哪一方。子组件可以接受父组...