随笔分类 - Vue.js前端
摘要：使用NPM（Node.js包管理工具）安装依赖时速度特别慢，为了安装Express，执行命令后两个多小时都没安装成功，最后只能取消安装，笔者20M带宽，应该不是我网络的原因，后来在网上找了好久才找到一种最佳解决办法， 在安装时可以手动指定从哪个镜像服务器获取资源，我们可以使用阿里巴巴在国内的镜像服务
阅读全文
摘要：1.获取DOM元素和组件：this.$refs
阅读全文
摘要：1.父组件给子组件传值 2.父组件把方法传递给子组件
阅读全文
摘要：1.使用`flag`标识符结合`v-if`和`v-else`切换组件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, i
阅读全文
摘要：1.组件中展示数据和响应事件: // 1. 组件可以有自己的 data 数据 // 2. 组件的 data 和 实例的 data 有点不一样,实例中的 data 可以为一个对象 // 3. 但是组件中的 data 必须是一个方法 data: function(){}或者data(){} // 4.
阅读全文
摘要：1.定义Vue组件 什么是组件： 组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可； 组件化和模块化的不同： + 模块化： 是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一； +
阅读全文
摘要：Document 这是一个H3 --> 这是一个H3 --> 这是一个H3
阅读全文
摘要：可参考Vue中的动画：https://cn.vuejs.org/v2/guide/transitions.html 为什么要有动画：动画能够提高用户的体验，帮助用户更好的理解页面中的功能； 1.不使用动画： 2.使用过渡类名实现动画 <!DOCTYPE html> <html lang="en">
阅读全文
摘要：代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-e
阅读全文
摘要：1. 由于浏览器的安全性限制，不允许AJAX访问 协议不同、域名不同、端口号不同的数据接口，浏览器认为这种访问不安全；2. 以通过动态创建script标签的形式，把script标签的src属性，指向数据接口的地址，因为script标签不存在跨域限制，这种数据获取方式，称作JSONP（注意：根据JSO
阅读全文
摘要：1.vue-resource 实现 get, post, jsonp请求：https://github.com/pagekit/vue-resource 注意： 除了 vue-resource 实现数据 Ajax 请求之外，还可以使用 `axios` 的第三方包实现实现数据的请求 代码：
阅读全文
摘要：1.Vue实例的生命周期： 什么是生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！ 生命周期钩子 = 生命周期函数 = 生命周期事件 2. 主要的生命周期函数分类： 2.1.创建期间的生命周期函数： + beforeCreate：实例刚在内存中被创建
阅读全文
摘要：1.自定义全局指令实现： 需求：为搜索名称关键字添加自定义指令：v-focus，使得进入页面后即获得焦点 需求：使用 Vue.directive()定义全局的指令v-focus 实现： [自定义指令参考](https://cn.vuejs.org/v2/guide/custom-directive.
阅读全文
摘要：1.按键修饰符的使用： 为name文本框添加keyup按键事件：监听特定键enter的事件(enter：Vue内部提供的) 2.系统自带的按键修饰符： 3.自定义按键修饰符： 如下： [js 里面的键盘事件对应的键码](http://www.cnblogs.com/wuhua1/p/6686237.
阅读全文
摘要：1.概念： Vue.js 允许你自定义过滤器，可被用作一些常见文本的格式化，过滤器可以用在两个地方：mustache 插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符指示； 2.过滤器调用时候的格式： 例如：下面HTML元素使用过滤器(在输出ctim
阅读全文
摘要：1.安装步骤： 打开谷歌浏览器设置 -->扩展程序 --》勾选开发者模式 》加载已解压的扩展程序 》选择“chrome扩展”文件夹即可；
阅读全文