在做web开发时候很多时候都需要即时监听输入框值的变化，以便作出即时动作去引导浏览者增强网站的用户体验感。而采用onchange时间又往往是在输入框失去焦点（onblur）时候触发，有时候并不能满足条件。
首先看一下dom中元素事件：
onpropertychange： IE下，当一个HTML元素的属性改变的时候，都能通过 onpropertychange来即时捕获。onchange在属性值改变时还必须使得当前元素失去焦点(onblur)才可以激活该事件。 在用js脚本改动该元素值时候亦能触发onpropertychange事件。
oninput： 是onpropertychange的非IE浏览器版本，支持firefox和opera等浏览器，但有一点不同，它绑定于对象时，并非该对象所有属性改变都能触发事件，它只在对象value值发生改变时奏效。
onchange： (a)当前对象属性改变，并且是由键盘或鼠标事件激发的（脚本触发无效）；(b)当前对象失去焦点(onblur)；
因此，可以采用以下代码实时监听输入框值变化
混入minxins：分发vue组件中可复用功能的灵活方式。混入对象可以包含任意组件选项。组件使用混入对象时，所有混入对象的选项将混入该组件本身的选项。
Linux：Settings —> Editor —> Inspections —> General —> Duplicated Code Mac：Preferences --> Editor —> Inspections —> General —> Duplicated Code fragment 将对应的勾去掉。
顾名思义， shadow-dom，直译的话就是 影子dom ？我觉得可以理解为潜藏在黑暗中的 DOM 结构，也就是我们无法直接控制操纵的 DOM 结构。前端同学经常用开发者工具的话，查看 DOM 结构的时候，肯定看到过下面这样的结构：
svg-sprite-loader会把你的icon塞到一个个symbol中，symbol的id如果不特别指定，就是你的文件名。它最终会在你的html中嵌入这样一个svg， 你就可以像上面这样：
虽然我们在日常开发的时候，在使用iview 或者element ui等组件时，通常会包含一些常用icon；但是在面对一些特定的需求时，或者自己想high一下，这些通用的icon并不能很好的满足我们。这个时候我们可能会拿到一些SVG适量图，但是怎么去使用这些矢量图呢。
SVG图形的一个最常见用例是图标系统，其中最常用的SVG sprite技术就是使用SVG<use> 元素在文档中任意位置“实例化”图标。 使用<use>元素实例化图标或任何其它的SVG元素或图像，给元素添加样式时经常会碰到一些问题。这篇文章的目的是尽可能给你介绍一些方法来解决：使用<use>引入的内容添加样式受限的问题。 但是在开始之前，我们先快速浏览一下SVG的主要结构和分组元素，然后慢慢进入use的世界中，以及shadow DOM，然后重回CSS的怀抱。我们会逐步讲解为什么给<use>内容添加样式会比较麻烦，以及有什么好的解决方案。
更改svg颜色，重点是去掉fill属性才能自由的更改颜色
子元素有个flex-shrink属性，表示在父元素宽度不够的情况下是自动收缩不？0表示不自动收缩，1表示自动收缩；所以将子元素（图片）添加属性：flex-shrink:0;即
在项目中使用axios上传文件，记得new一个纯净的axios或者考虑用ajax请求。因为axios在项目估计已经用了全局配置请求头等信息，这里的配置可能被全局请求头拦截，导致请求失败。 2.1构造formData 作者：exmexm 链接：https://www.jianshu.com/p/9c708a47d8a5 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
nuxtjs，插件开发，import，绝对路径