Dobility

前言有时候我们需要对一个组件绑定自定义 v-model，以更方便地实现双向数据，例如自定义表单输入控件。甚至有时候，我们想要实现绑定多个 “v-model”，也就是多个“双向绑定”，例如带表单输入的模块框，想同时控制模态框的显示状态与表单的输入状态。好在 vue 3 已经实现了多 v-model，那么在 vue 2 上我们可以如下实现。单个“双向绑定”的实现使用 model 实现其实 v-model 只是 value + change 的语法糖，监听输入并触发改变，因此只要实现 “监听” +

TS类型断言简化对象类型声明前言在使用了 typescript 的项目开发中，有时候为了某个对象进行声明，经常需要写完 interface 之后，在赋值的时候又写了一遍一模一样的代码；当想对它增加一个键值，又得去增加 interface 的字段声明。很想要像声明一个普通变量那样，对某个键值直接进行类型声明。对象类型声明的传统方式对于对象的类型声明，我们经常使用 interface、type、class 的方式，先对整体类型进行声明，然后再去赋值，例如：interface IInterface {

平时在对一个数据进行凑合用的 json化，我们会直接 JSON.stringify(obj) 输出一个一行的字符串，并且会自动过滤掉 undefined、Function等内容。但它实际上能够接3个参数。JSON.stringify(str, replacer?, space?)https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringifyspace 大于0时是用来美

现象在有 Vue Router 的项目开发过程中，在 Object.prototype 上挂自定义方法，会发现它的函数体内容会被拼接到 url 参数里。（下面以 Object.prototype.log 为例）import Vue from 'vue'import App from './App'import router from './router'// 在 Object.proto...

最近建表的时候，is_promotion字段打算用来放 true|false|NULL 的布尔变量，于是设置了 bit 类型。在node端使用knex查询的时候，在对 is_promotion 取值的时候展示了一个类似普通对象的假象：通过 is_promotion.data[0]取值将会报错或者无效。事实上它返回的不是 true | false | null 或者 0 | 1 | null，也...

每次修改都会引起 render最近在开发的时候，发现在内容较多的首页上对 v-model 绑定的输入框上输入内容，页面会变得很卡顿，有些带有动画的元素还会闪动，初步怀疑是 v-model 实时更新引起整个组件（页面）的 re-render。连续执行了输入“123456789”，通过浏览器开发者工具的 Performance 观察发现，确实是如此：可以看到会连续触发9个事件，每个事件中都含有 ...

Vue 的双向数据绑定，使得修改数据后，视图就会跟着发生更新，比如对数组进行增加元素、切割等操作。然而直接通过下标修改数组内容后，视图却不发生变化。那么，在保留原有的数组响应方式下，为什么 Vue 不增加对数组下标的响应式监听呢？arr[index] = val 不是响应式的在 Vue 官网的 列表渲染 — Vue.js 中，有强调 Vue 不能 直接检测通过数组下标改变值的变化，需要通过 数...

为什么有深浅拷贝这得从JavaScript的变量中包含两种类型的值说起基本类型值基本类型值指的是存储在栈中的一些互相隔离的简单的数据段，比如 String, Number, Boolean 等简单类型引用类型值引用类型值是引用类型的实例，它是保存在堆内存中的一个对象，引用类型是一种数据结构，最常用的是Object, Array, Function类型，另外还有Date, RegE...

一、有序数组的去重暴力去重，利用循环每次判断当前元素是否在数组中别的地方出现过，此处不展开介绍利用 es6 的 Set 是不重复集合的特性function reduceRepeatBySet(arr) { return Array.from(new Set(arr))}利用object的key不能重复的特性function reduceRepeatByObject(a...

问题在前端多页面（多html）开发的时候，使用webpack进行HMR热部署，但每一次修改之后，热部署持续很长的时间，而且页面越多，时间越长，观察可知大部分时间花在 asset optimization 这一步。每次修改都会触发所有页面的重新构建，但其实我们只需要更新修改的页面即可。原因使用 vue-cli 等脚手架搭建的时候，会默认在 webpack.dev.conf.js 中配...

问题在使用 Webstorm 写 es6、node的时候，会出现没有语法提示甚至是产生波浪线，例如常用的 require, import不仅是内置函数语法，不仅是 js，在一些第三方npm库（比如 element-ui），在 vue/html 等上也被黄色背景色标上“未知标签名”的语法提示既影响美观，又不支持代码候选补全，实在对不起 WebStorm 前端开发利器的称号。 ...

VueRouter声明：const router = new VueRounter({ routes: [ {name: 'Home', path: '/', component: Home}, {name: 'Category', path: '/category', component: Category}, {name: 'P...

最近一段时间在学习网站前端开发，在编写HTML的时候，总是抱着“能实现就好”的态度，大量地使用div等“万金油标签”，给别人和自己带来了阅读上很大的麻烦。　　正如一个公司一样，每个部门各司其职；其实一个HTML文档也是，每个HTML标签都自己的语义。下面的资料是从上网摘抄过来的，和大家分享一下。============================================

HTML5 和 CSS3 推出已经很久了，然而在它推出之前，早就有 IE 的存在，所以不可避免地发生 IE8 及其更早版本不支持 H5 新标签新特性和 CSS3 新内容这样的尴尬局面，而且还存在着对 JavaScript 的兼容问题……　　虽然微软已经对 IE 弃疗，转向 Edge 的开发，但从市场份额上看，显然我国的网民还没放手 IE，仍然有很多人在使用 IE8 及其更早的版本（因为 win

做过前端开发的应该知道 IE 是最令码农头疼的浏览器。适应性不好先不说吧，自家浏览器的不同版本的差别还那么大，IE8及以下版本的浏览器不支持 html5，不支持 css3，甚至有些 JavaScript 还不支持！！！然而，IE 是自带在 Windows 操作系统的，不同 Windows 版本自带的 IE 版本也不一样，你装了系统就会带上 IE 浏览器，IE浏览器一般不会自动更新，不像其他浏览器你