Vue
  • 1、install 函数 把组件做成插件 方便全局调用;
  • 2、use函数 注册引入的插件-插件是install过的; 否则要Vue.prototype.name
  • 3
1、$event
2、事件修饰符号stop、prevent、capture、self、once、passive
3、使用修饰符时,顺序很重要;相应的代码会以同样的顺序产生。因此,用 v-on:click.prevent.self 会阻止所有的点击,而 v-on:click.self.prevent 只会阻止对元素自身的点击
4、不要把 .passive 和 .prevent 一起使用,因为 .prevent 将会被忽略,同时浏览器可能会向你展示一个警告。请记住,.passive 会告诉浏览器你不想阻止事件的默认行为。

5、按键修饰符
6、按键码的别名、key 值
7、你还可以通过全局 config.keyCodes 对象自定义按键修饰符别名:Vue.config.keyCodes.f1 = 112
8、系统修饰键
9、exact 修饰符修饰符允许你控制由精确的系统修饰符组合触发的事件。
10、鼠标按钮修饰符
1、语法糖
2、v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。
3、text 和 textarea 元素使用 value 属性和 input 事件;checkbox 和 radio 使用 checked 属性和 change 事件;select 字段将 value 作为 prop 并将 change 作为事件。
4、在文本区域插值 (<textarea>{{text}}</textarea>) 并不会生效,应用 v-model 来代替。
5、 label=for input=id
6、如果 v-model 表达式的初始值未能匹配任何选项,<select> 元素将被渲染为“未选中”状态。在 iOS 中,这会使用户无法选择第一个选项。因为这样的情况下,iOS 不会触发 change 事件。因此,更推荐像上面这样提供一个值为空的禁用选项。
7、对于单选按钮,复选框及选择框的选项,v-model 绑定的值通常是静态字符串 (对于复选框也可以是布尔值):
8、v-modal修饰符
    v-model lazy 修饰符  将输入框的值与数据进行同步 
    v-model number 修饰符 
    v-model  .trim修饰符  自动过滤用户输入的首尾空白字符
1、一个组件的 data 选项必须是一个函数,因此每个实例可以维护一份被返回对象的独立的拷贝:
2、有两种组件的注册类型:全局注册和局部注册
3、折行转义字符
4、https://blog.csdn.net/wxl1555/article/details/83187647
https://www.cnblogs.com/xiangxinhouse/p/8447507.html
5、在上述示例中,currentTabComponent 可以包括已注册组件的名字,或一个组件的选项对象
1、命名 kebab-case
1、JSX 语法
2、直接写渲染 (render) 函数
2、 v-once 
4、不能使用 v-html 来复合局部模板,因为 Vue 不是基于字符串的模板引擎
5、站点上动态渲染的任意 HTML 可能会非常危险,因为它很容易导致 XSS 攻击。请只对可信内容使用 HTML 插值,绝不要对用户提供的内容使用插值。
6、v-bind:id="'list-' + id"
7、每个绑定都只能包含单个表达式  这是语句,不是表达式  流控制也不会生效,请使用三元表达式
8、指令、参数(‘href’)、修饰符
9、动态参数,值 某些字符,如空格和引号,放在 HTML attribute 名里是无效的 <a v-bind:['foo' + bar]="value"> ... </a>
10、避免使用大写字符来命名键名,因为浏览器会把 attribute 名全部强制转为小写:
11、单页面应用程序



1、计算属性是基于它们的响应式依赖进行缓存的,只在相关响应式依赖发生改变时它们才会重新求值
2、侦听器 需要在数据变化时执行异步或开销较大的操作时
3、
<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/lodash@4.13.1/lodash.min.js"></script>


1、v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }"
2、自动添加前缀;
3、多重值;
<div :style="{ display: ['-webkit-box', '-ms-flexbox', 'flex'] }"></div>


1、用 key 管理可复用的元素
2、v-show display
3、v-show 不支持 <template> 元素
4、v-if惰性的
5、v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。
6、被迭代的数组元素
7、Object.keys()
8、变异方法、替换方法
9、slice()、splice()、split()、
10、
Vue.set(vm.items, indexOfItem, newValue)
vm.items.splice(indexOfItem, 1, newValue)
vm.$set(vm.items, indexOfItem, newValue)
vm.items.splice(newLength)
Vue.set(object, propertyName, value)
Vue.set(vm.userProfile, 'age', 27)
vm.$set(vm.userProfile, 'age', 27)
11、Object.assign() 或 _.extend()
12、用两个对象的属性创建一个新的对象
13、注意这里的 is="todo-item" 属性。这种做法在使用 DOM 模板时是十分必要的,因为在 <ul> 元素内只有 <li> 元素会被看作有效内容。这样做实现的效果与 <todo-item> 相同,但是可以避开一些潜在的浏览器解析错误
1、Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统
2、把数据绑定到 DOM 文本或特性,还可以绑定到 DOM 结构。
3、没有触碰 DOM,编写的代码只需要关注逻辑层面即可
4、实现表单输入和应用状态之间的双向绑定
5、自定义元素
6、 Web 组件规范
7、web组件未被所有浏览器原生实现、Vue 组件不需要任何 polyfill,并且在所有支持的浏览器 (IE9 及更高版本) 之下表现一致
Vue 组件提供了纯自定义元素所不具备的一些重要功能,最突出的是跨组件数据流、自定义事件通信以及构建工具集成。
8、MVVM 模型
9、所有的 Vue 组件都是 Vue 实例,接受相同的选项对象 (一些根实例特有的选项除外)。
10、Object.freeze()
11、vm.$data,vm.$el,vm.$watch
12、生命周期不要在选项属性或回调上使用箭头函数 this指向不明
特性
1、脚本语言的规范:ECMAScript-特性、标准
2、审查、调试界面
3、链接到一个明确的版本号和构建文件

 Vue Devtools  Vue调整工具
Vue 被注册全局变量
CDN内容分发网络-访问速度更快,提高体验效果

模块化
1、JavaScript模块化(ES Module/CommonJS/AMD/CMD)
https://www.jianshu.com/p/da2ac9ad2960
2、模块打包器 webpack 、 Browserify 
组件
1、单文件组件
2、单页面应用 (SPA)
3、脚手架
4、 batteries-included
5、Node.js 
6、npm
7、UMD
8、完整版 包括编译器和运行时的版本;
9、编译器-代码:用来将模版字符串编译成javascript渲染函数的代码
10、UMD UMD版本 通过 <script> 标签直接用在浏览器中
11、CommonJS 版本 用来配合老的打包工具
12、ES Module 提供两个 ES Modules (ESM) 构建文件
13、老打包工具Browserify 、 webpack 1;新打包工具 webpack 2 、 Rollup
14、tree-shaking
15、pkg.module
16、vue-loader
17、vueify
18、webpack、Rollup、Browserify、Parcel
19、CSP 环境
20、通过 webpack + vue-loader 或者 Browserify + vueify 构建
21、AMD 模块加载器

1、Vue引用css

https://segmentfault.com/q/1010000010044704
杂项记录

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

赞赏支持
X
支付宝
9.99
支付故障请联系QQ:565830900
因10.00元通道已占用,系统建议您支付9.99元
正在生成二维码, 此过程可能需要15秒钟
谢谢支持,我一定会更加努力的
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里只属于前端工程师。