Lawson's Blog

2009年，W3C 提出了一种新的方案—-Flex 布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。 Flex布局是什么？Flex 是 Flexible Box 的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。 123.box{ display: fle... 阅读全文…

Grid布局Grid布局是什么？网格布局（Grid）是最强大的 CSS 布局方案。是一种新的 CSS 布局模型，比较擅长将一个页面划分为几个主要区域，以及定义这些区域的大小、位置、层次等关系。号称是最强大的的 CSS 布局方案，是目前唯一一种 CSS 二维布局。 ... 阅读全文…

Vue.config 是一个对象，包含 Vue 的全局配置。可以在启动应用之前修改下列 property： silent 类型：boolean 默认值：false 用法：1Vue.config.silent = true 取消 Vue 所有的日志与警告。optionMergeStrategies 类型：{ [key: string]: Function } 默认值：{} 用法：1234567... 阅读全文…

如何追踪变化？当你把一个普通的 JavaScript 对象传入 Vue 实例作为 data 选项，Vue 将遍历此对象所有的 property，并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。数据代理的另一个说法是数据劫持，当我们在访问或者修改对象的某个属性时，数据劫持可以拦截这个行为并进行额外的操作或者修改返回的结果。我们... 阅读全文…

HTML语义化HTML 语义化是指仅仅从 HTML 元素上就能看出页面的大致结构，比如需要强调的内容可以放在 <strong> 标签中，而不是通过样式设置 <span> 标签去做。不同浏览器对 HTML 元素的解析可能有差异，HTML 语义化便是在抛开样式之后，页面能有一个友好的展示效果。我们力求让页面有良好的结构，让页面的元素有含义，同时利于被搜索引擎解析，利于 S... 阅读全文…

所有HTML元素可以看作盒子，在CSS中，box model这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。下面的图片说明了盒子模型(Box Model)： ... 阅读全文…

什么是Promise？Promise是JS异步编程中的重要概念，异步抽象处理对象，是目前比较流行Javascript异步编程解决方案之一。从语法上来说:Promise是一个构造函数。从功能上来说：promise对象是用来封装一个异步操作并可以获取其结果。 Promises/A+ 规范为实现者提供一个健全的、可互操作的 JavaScript promise 的开放标准。 相关术语 解决 (fu... 阅读全文…

拷贝是啥？顾名思义也就是复制，我们知道在JavaScript中基本数据类型都是保存在栈中的，而复杂数据类型（object）是保存在堆中的，在栈中不过是保存了堆的地址（引用）。 浅拷贝与深拷贝浅深拷贝都是对引用类型的数据而言的，基本数据类型一赋值就开辟了独立的栈空间，互不影响。 浅拷贝：当我们对基本数据类型复制，会把值全部复制过去的。如果是引用类型，也是把值复制过去，不过这个值是地址引用。这... 阅读全文…

混入基础混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。当组件和混入对象含有同名选项时，这些选项将以恰当的方式进行“合并”。比如，数据对象在内部会进行递归合并，并在发生冲突时以组件数据优先。同名钩子函数将合并为一个数组，因此都将被调用。另外，混入对象... 阅读全文…

前言这篇文章是关于组件/单元素的过渡效果和动画效果，也是上一篇文章的续篇。 进入/离开&列表过渡单元素/组件的过渡Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/离开过渡: 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 组件根节点这里是一个典型的例子：12345678<div id="demo">... 阅读全文…