网站链接：
我爱捣鼓
我们经常看到Vue开发中会使用三个点后面跟一个变量，这三个点代表：扩展运算符。 扩展运算符是什么意思呢，对数组和对象而言，就是将运算符后面的变量里东西每一项拆下来。举例说明 操作数组举例// 1.把数组中的元素孤立起来let iArray = [1, 2, 3];consol…
?: 一般用用于TS文件里面：意思指的是自动加上undefined的类型(下面的例子表示y可以是number类型或者undefined)举例说明function getval(x: number, y?: number) { return x + (y || 0);}getval(1, 2);getval(1);getval(1, undefined);getval(1, null); // error, n…
学习Vue的过程中，大家肯定都使用过nextTick()，关于nextTick()的使用时机，大家肯定都知道，那么它的工作原理是怎样的呢，本文就简单说一下它的nextTick()的工作原理。 nextTick内部其实就是根据这种机制来运行的。我们都知道nextTick是让浏览器在页面渲染后在执…
插槽在vue的开发中显得很有用处，今天我们就来说说如何通过插槽来给子组件分配内容？ 一些情况下我们会希望能和 HTML 元素一样向组件中传递内容：<AlertBox> Something bad happened.</AlertBox> 我们期望能渲染成这样： 这可以通过 V…
watch是什么？ watch:是vue中常用的侦听器（监听器），用来监听数据的变化。watch的使用watch: { 这里写你在data中定义的变量名或别处方法名: { handler(数据改变后新的值, 数据改变之前旧的值) { 这里写你…
我们知道vue v-html的作用是向指定节点中渲染包含html结构的内容。 那vue v-html的内容能放链接吗？ 我们先来看看下面的例子。<!DOCTYPE html><head> <title>v-html</title> <script type="text/javascript" s…
要弄清楚vue中v-if和v-show那个性能更高这个问题，我们先来了解一下v-if和v-show的基础知识。v-if v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回真值时才被渲染。<h1 v-if="awesome">Vue is awesome!</h1>v-else …
vue methods可以使用箭头函数吗?要弄清楚这问题我们首先要清除什么是箭头函数 ES6标准新增了一种新的函数：Arrow Function（箭头函数）。 为什么叫Arrow Function？因为它的定义用的就是一个箭头：x => x * x 上面的箭头函数相当于：function (…
Vue中的选项式 API 和组合式 API到底有什么区别?今天我们带着这个问题深入了解一下Vue中的选项式 API 和组合式 API。选项式 API (Options API) 使用选项式 API，我们可以用包含多个选项的对象来描述组件的逻辑，例如 data、methods 和 mounted。选项所定义的属性…
样式穿透1、为什么需要穿透scoped？ 引用了第三方组件后，需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。此时只能通过特殊的方式，穿透scoped。2、样式穿透的方法 样式穿透的写法有三种：>>>、/deep/、:…
这几天用vue开发前端，在v-html中使用的样式不起作用，代码如下所示：<table class="table" v-html="table_data" width="100%"> { {table_data}}</table> <script> export default { data(){ r…
scss中使用/deep/深度选择器报错 需求 ： 在带有scoped属性的style中书写样式时，无法作用影响到子组件中的样式，此时我们会使用到deep深度选择器，来解决此问题，我们在使用less预处理器，能正常使用，但是在scss预处理器中会报错。 错误代码：<style …
什么是scoped 在Vue文件中的style标签上有一个特殊的属性，scoped。当一个style标签拥有scoped属性时候，它的css样式只能用于当前的Vue组件，可以使组件的样式不相互污染。如果一个项目的所有style标签都加上了scoped属性，相当于实现了样式的模块化。scoped的实现…
vue-rfcs项目管理了Vue的RFC文档，并使用PR对新特性进行讨论和改进。通过读这些内容，我们可以很清晰的了解到一个框架的特性演变的历程，以及作者和开发者对其的疑问和理解。vue-rfcs并不仅仅是一个讨论新特性的地方，他也给了我们直接了解Vue作者（不仅仅是yyx）的机会。…
vue指令钩子函数的作用和用法bind 只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。inserted 被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。updated 所在组件的 VNode 更新时调用，但是可能…
vue updated用法 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。当这个钩子被调用时，组件 DOM 已经更新，所以你现在可以执行依赖于 DOM 的操作。 只有data里的变量改变并且要在页面重新渲染完成之后,才会进updated生命周期，只改变…
vue updated方法的触发条件是当data中定义的数据有变化时就会加载updated方法 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用updated钩子函数。 无论是组件本身的数据变更，还是从父组件接收到的 props 或者从vuex里面拿到的数据有变更，都…
vue钩子函数update的作用就是数据修改时执行，那么在调用后updated函数被反复触发是什么原因呢？<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge&…
vue钩子函数update一般是数据修改时执行，由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用updated钩子函数。 无论是组件本身的数据变更，还是从父组件接收到的 props 或者从vuex里面拿到的数据有变更，都会触发虚拟 DOM 重新渲染和打补丁，并在之后…
我们在了解vue inserted钩子函数之前，先来了解一下vue的钩子函数。钩子 钩子这事情需要相对的理解，直白点说，它也只是一些函数而已。但是把一些指定情况的函数组合成一个链条，就像描述一个动作的开始到结束的过程，亦或者是一个人的出生到死亡的过程。 …
