- 博客(47)
- 资源 (78)
- 收藏
- 关注
RSS订阅
原创 Vue.js_03_开发工具
本系列博客汇总在这里：Vue.js 汇总开发工具一、HBiulder X（推荐）二、VsCode（推荐）三、其他源码工程文件为：一、HBiulder X（推荐）下载地址二、VsCode（推荐）下载地址三、其他略如有错误，欢迎指正！...
2020-04-27 13:16:12
868
原创 Vue.js_05_列表展示
本系列博客汇总在这里：Vue.js 汇总列表展示数组存储数据1、直接使用数组名称2、使用数组下标3、v-for 指令初体验源码工程文件为：数组存储数据1、直接使用数组名称2、使用数组下标3、v-for 指令初体验从上面的展示来看，从数组中获取数值是可以做到的，那是不是也可以遍历数组呢？答案是可以的，我们使用 v-for 指令就可以做到这一点，如下：我们再来体验下之前所述...
2020-04-27 13:15:53
374
原创 Vue.js_06_计数器案例
本系列博客汇总在这里：Vue.js 汇总计数器案例一、功能说明二、methods 和 v-on:click1、methods2、v-on:click源码工程文件为：一、功能说明点击加号实现计数器增一，点击减号实现计数器减一。上图中的代码已经实现了计数器的功能，但是如果行的需求出现，例如我们需要在加一的时候输出一句话，那该怎么实现呢？这就需要我们要说的属性 methods 了。其实...
2020-04-27 13:15:43
740
原创 Vue.js_30_组件双向绑定案例
本系列博客汇总在这里：Vue.js 汇总组件双向绑定案例源码工程文件为：注意：修改后：最终效果：效果图完整代码：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <...
2020-04-27 13:15:25
309
原创 Vue.js_00_ES6 语法
本系列博客汇总在这里：Vue.js 汇总ES6 语法一、什么是 ES6？二、let/var 关键字三、const 关键字四、对象字面量的增强写法1、属性的增强写法2、函数的增强写法源码工程文件为：一、什么是 ES6？ECMAScript 6（简称 ES6）是于 2015 年 6 月正式发布的 JavaScript 语言的标准，正式名为ECMAScript 2015（ES2015）。它...
2020-04-27 13:07:18
316
原创 Vue.js_26_小案例
本系列博客汇总在这里：Vue.js 汇总小案例一、需求说明二、代码实现1、style.css2、demo.html3、main.js三、实现效果源码工程文件为：一、需求说明购物车。二、代码实现1、style.csstable { border: 1px solid #e9e9e9; border-collapse: collapse; border-spacing...
2020-04-27 13:07:06
286
原创 Vue.js_24_数组中的常用方法
本系列博客汇总在这里：Vue.js 汇总v-show 指令一、说明及使用方法源码工程文件为：一、说明及使用方法
2020-04-27 13:06:54
727
原创 Vue.js_27_JavaScript 高阶函数的使用
本系列博客汇总在这里：Vue.js 汇总JavaScript 高阶函数的使用一、for二、filter三、map四、reduce五、结合使用源码工程文件为：一、for二、filter三、map四、reduce五、结合使用如有错误，欢迎指正！...
2020-04-27 13:06:40
357
原创 Vue.js_28_v-model 指令
本系列博客汇总在这里：Vue.js 汇总v-model 指令使用说明源码工程文件为：使用说明表单控件在实际开发中是非常常见的。特别是对于用户信息的提交，需要大量的表单。Vue 中使用 v-model 指令来实现表单元素和数据的双向绑定。案例的解析：当我们在输入框输入内容时，因为 input 中的 v-model 绑定了 message，所以会实时将输入的内容传递给 messag...
2020-04-27 13:06:28
321
原创 Vue.js_29_组件化开发
本系列博客汇总在这里：Vue.js 汇总组件化开发一、什么是组件化？二、Vue 组件化思想三、注册组件的基本步骤四、注册组件步骤解析1、Vue.extend()2、Vue.component()3、组件必须挂载在某个 Vue 实例下，否则它不会生效五、全局组件和局部组件六、父组件和子组件七、注册组件语法糖八、组件模板抽离九、组件可以访问 Vue 实例数据吗?十、父子组件的通信1、说明2、父传子（...
2020-04-27 13:06:15
413
原创 Vue.js_31_父子组件的访问方式
本系列博客汇总在这里：Vue.js 汇总父子组件的访问方式一、$children二、$refs三、$parent 和 $root源码工程文件为：一、$children有时候我们需要父组件直接访问子组件，子组件直接访问父组件，或者是子组件访问跟组件。父组件访问子组件：使用 $children 或 $refs reference (引用)子组件访问父组件：使用 $parent我...
2020-04-27 13:06:02
415
原创 Vue.js_32_插槽（slot）的使用
本系列博客汇总在这里：Vue.js 汇总@TOC源码工程文件为：一、为什么使用插槽？在生活中很多地方都有插槽，电脑的 USB 插槽，插板当中的电源插槽。插槽的目的是让我们原来的设备具备更多的扩展性。比如电脑的 USB 我们可以插入 U 盘、硬盘、手机、音响、键盘、鼠标等等。组件的插槽也是为了让我们封装的组件更加具有扩展性，让使用者可以决定组件内部的一些内容到底展示什么。例子：移动...
2020-04-27 13:05:50
400
原创 Vue.js_33_前端模块化开发思想
本系列博客汇总在这里：Vue.js 汇总前端模块化开发一、JavaScript 原始功能二、CommonJS（了解）三、exportn 基本使用四、导出函数或类五、export default六、import 使用源码工程文件为：一、JavaScript 原始功能在网页开发的早期，js 制作作为一种脚本语言，做一些简单的表单验证或动画实现等，那个时候代码还是很少的。那个时候的代码是...
2020-04-27 13:05:39
744
原创 Vue.js_34_Webpack 详解
本系列博客汇总在这里：Vue.js 汇总Webpack 详解一、认识 webpack1、什么是 webpack？2、前端模块化3、打包如何理解呢？4、和 grunt/gulp 的对比二、webpack 的安装1、查看自己的 node 版本2、全局安装 webpack3、局部安装 webpack（后续才需要）三、webpack 的起步1、准备工作2、js 文件的打包3、测试 ES6 的写法4、入口...
2020-04-27 13:05:03
355
原创 Vue.js_35_ 脚手架（Vue CLI）
本系列博客汇总在这里：Vue.js 汇总脚手架（Vue CLI）相关一、什么是 Vue CLI？二、Vue CLI 使用前提 - Node三、Vue CLI 使用前提 - Webpack四、Vue CLI 的使用1、安装 Vue 脚手架2、Vue CLI2 初始化项目3、Vue CLI3 初始化项目源码工程文件为：一、什么是 Vue CLI？如果你只是简单写几个 Vue 的 Demo...
2020-04-27 13:04:52
554
原创 Vue.js_36_ 箭头函数的使用和 this 指向
本系列博客汇总在这里：Vue.js 汇总箭头函数的使用和 this 指向一、箭头函数二、this 指向源码工程文件为：一、箭头函数箭头函数: 也是一种定义函数的方式。二、this 指向<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <t...
2020-04-27 13:04:42
1042
原创 Vue.js_37_vue-router 详解
本系列博客汇总在这里：Vue.js 汇总vue-router 详解一、认识路由1、后端路由阶段2、前端路由阶段前后端分离阶段单页面富应用阶段3、URL 的 hash4、HTML5 的 history 模式pushStatereplaceStatego补充说明二、vue-router 基本使用1、认识 vue-router2、安装和使用 vue-router安装简单框架搭建使用 vue-route...
2020-04-27 13:04:31
1291
原创 Vue.js_39_Promise
本系列博客汇总在这里：Vue.js 汇总Promise一、什么是 Promise 呢？二、网络请求的回调地狱三、定时器的异步事件四、定时器异步事件解析五、Promise 三种状态六、Promise 链式调用源码工程文件为：一、什么是 Promise 呢？Promise 是异步编程的一种解决方案。function runAsync(){ var p = new Promise...
2020-04-27 13:03:53
417
原创 Vue.js_40_Vuex 详解
本系列博客汇总在这里：Vue.js 汇总Vuex 详解一、Vuex 是做什么的?二、管理什么状态呢?三、单界面的状态管理四、多界面状态管理五、Vuex 核心概念1、State 单一状态树2、Getters 基本使用3、Mutation 状态更新4、Mutation 传递参数5、Mutation 提交风格6、Mutation 响应规则7、Mutation 常量类型 – 概念8、Mutation 同...
2020-04-27 13:03:35
767
原创 Vue.js_41_ 网络请求（axios）
本系列博客汇总在这里：Vue.js 汇总网络请求一、选择什么网络模块?1、选择一：传统的 Ajax2、选择二：jQuery-Ajax3、选择三：Vue-resource4、选择四：axios二、jsonp三、axios 框架的使用1、安装1、功能特点2、axiox 请求方式四、全局配置五、常见的配置选项六、axios 的实例七、axios 封装八、如何使用拦截器？源码工程文件为：一、选...
2020-04-27 13:02:50
443
原创 Vue.js_25_小练习
本系列博客汇总在这里：Vue.js 汇总小练习一、需求说明二、代码实现源码工程文件为：一、需求说明点击那个选项，那个就变成红色，也就是所谓的选中状态。二、代码实现<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Titl...
2020-04-27 12:59:11
358
原创 Vue.js_23_v-for 指令
本系列博客汇总在这里：Vue.js 汇总v-for 指令一、v-for 遍历数组二、v-for 遍历对象源码工程文件为：一、v-for 遍历数组当我们有一组数据需要进行渲染时，我们就可以使用 v-for 来完成。v-for 的语法类似于 JavaScript 中的 for 循环。格式：item in items如果在遍历的过程中不需要使用索引值依次从 array 中取出...
2020-04-27 12:59:00
433
原创 Vue.js_22_v-show 指令
本系列博客汇总在这里：Vue.js 汇总v-show 指令一、说明及使用方法二、v-if 和 v-show 对比源码工程文件为：一、说明及使用方法v-show 的用法和 v-if 非常相似，也用于决定一个元素是否渲染。二、v-if 和 v-show 对比v-if 和 v-show 都可以决定一个元素是否渲染，那么开发中我们如何选择呢？v-if 当条件为 false 时，压根...
2020-04-27 12:58:49
423
原创 Vue.js_21_条件渲染案例
本系列博客汇总在这里：Vue.js 汇总条件渲染案例一、案例说明及实现二、input 复用问题1、存在问题2、问题解答3、解决方案三、for 属性补充说明源码工程文件为：一、案例说明及实现用户再登录时，可以切换使用用户账号登录还是邮箱地址登录。如下：二、input 复用问题1、存在问题如果我们在有输入内容的情况下，切换了类型，我们会发现文字依然显示之前的输入的内容。但是按道...
2020-04-27 12:58:37
351
原创 Vue.js_20_v-if、v-else-if、v-else 指令
本系列博客汇总在这里：Vue.js 汇总v-if、v-else-if、v-else 指令一、简要说明二、v-if 的原理源码工程文件为：一、简要说明v-if、v-else-if、v-else 这三个指令与 JavaScript 的条件语句 if、else、else if 类似。Vue 的条件指令可以根据表达式的值在 DOM 中渲染或销毁元素或组件。简单的案例演示：二、v-if ...
2020-04-27 12:58:11
353
原创 Vue.js_19_v-on 指令
本系列博客汇总在这里：Vue.js 汇总v-on 指令一、事件监听二、v-on 基础三、v-on 参数四、v-on 修饰符源码工程文件为：一、事件监听在前端开发中，我们需要经常和用于交互。这个时候，我们就必须监听用户发生的时间，比如点击、拖拽、键盘事件等等。在 Vue.js 中如何监听事件呢？v-on作用：绑定事件监听器缩写：@预期：Function | Inline S...
2020-04-27 12:57:03
309
原创 Vue.js_18_计算属性和 methods 的对比
本系列博客汇总在这里：Vue.js 汇总计算属性和 methods 的对比对比说明源码工程文件为：对比说明当我们学完计算属性和 methods 以后，我们可能会考虑这样的一个问题：methods 和 computed 看起来都可以实现我们的功能，那么为什么还要多一个计算属性这个东西呢？原因：计算属性会进行缓存，如果多次使用时，计算属性只会调用一次。我们来看下面的代码：使用...
2020-04-27 12:56:50
256
原创 Vue.js_17_计算属性
本系列博客汇总在这里：Vue.js 汇总计算属性一、什么是计算属性？二、计算属性的复杂操作三、计算属性的 setter 和 getter源码工程文件为：一、什么是计算属性？我们知道，在模板中可以直接通过插值语法显示一些 data 中的数据。但是在某些情况，我们可能需要对数据进行一些转化后再显示，或者需要将多个数据结合起来进行显示。比如我们有 firstName 和 lastName ...
2020-04-27 12:56:36
260
原创 Vue.js_16_v-bind 指令动态绑定 Style
本系列博客汇总在这里：Vue.js 汇总v-bind 指令v-bind:style1、对象语法2、数组语法源码工程文件为：v-bind:style我们可以利用 v-bind:style 来绑定一些 CSS 内联样式。在写 CSS 属性名的时候，比如 font-size，我们可以使用驼峰式 (camelCase) fontSize ，或短横线分隔 (kebab-case，记得用单引号...
2020-04-27 12:56:22
403
原创 Vue.js_15_v-bind 指令动态绑定 Class
本系列博客汇总在这里：Vue.js 汇总v-bind 指令一、使用说明二、v-bind 的基本使用三、v-bind 绑定 class1、对象语法用法一用法二用法三用法四2、数组语法用法一用法二用法三用法四源码工程文件为：一、使用说明前面我们学习的指令主要作用是将值插入到我们模板的内容当中。但是，除了内容需要动态来决定外，某些属性我们也希望动态来绑定。比如动态绑定 a 元素的 hr...
2020-04-27 12:56:10
441
原创 Vue.js_14_v-cloak 指令
本系列博客汇总在这里：Vue.js 汇总v-cloak 指令使用场景源码工程文件为：使用场景在某些情况下，我们浏览器可能会直接显示出未编译的 Mustache 标签，就像下面这样的。这种情况我们也是可以做出调整的，如下：如有错误，欢迎指正！...
2020-04-27 12:55:59
288
原创 Vue.js_13_v-pre 指令
本系列博客汇总在这里：Vue.js 汇总v-pre 指令使用说明源码工程文件为：使用说明v-pre 用于跳过这个元素和它子元素的编译过程，用于显示原本的 Mustache 语法。比如下面的代码：如有错误，欢迎指正！...
2020-04-27 12:55:47
391
原创 Vue.js_12_v-text 指令
本系列博客汇总在这里：Vue.js 汇总v-text 指令使用说明源码工程文件为：使用说明v-text 作用和 Mustache 比较相似：都是用于将数据显示在界面中。v-text 通常情况下，接受一个 string 类型。如下：如有错误，欢迎指正！...
2020-04-27 12:55:36
329
原创 Vue.js_11_v-html 指令
本系列博客汇总在这里：Vue.js 汇总v-html 指令使用场景源码工程文件为：使用场景在某些情况下，我们从服务器请求到的数据本身就是一个 HTML 代码，如果我们直接通过 {{ }} 来输出，会将 HTML 代码也一起输出。但是我们可能希望的是按照 HTML 格式进行解析，并且显示对应的内容。如果我们希望解析出 HTM L展示，可以使用一个 Vue 指令：v-html该指令...
2020-04-27 12:55:25
446
原创 Vue.js_10_v-once 指令
本系列博客汇总在这里：Vue.js 汇总v-once 指令使用场景源码工程文件为：使用场景在某些情况下，我们可能不希望界面随意的跟随改变，这个时候，我们就可以使用一个 Vue 的指令。v-once:该指令后面不需要跟任何表达式（比如之前的 v-for 后面是由跟表达式的）。该指令表示元素和组件（组件后面才会学习）只渲染一次，不会随着数据的改变而改变。如下：如有错误，...
2020-04-27 12:55:11
261
原创 Vue.js_09_Mustache 语法
本系列博客汇总在这里：Vue.js 汇总Mustache 语法Mustache 语法源码工程文件为：Mustache 语法如何将 data 中的文本数据，插入到 HTML 中呢？我们已经学习过了，可以通过 Mustache 语法（也就是双大括号）。如有错误，欢迎指正!...
2020-04-27 12:54:57
268
原创 Vue.js_08_Vue 的生命周期
本系列博客汇总在这里：Vue.js 汇总Vue 的生命周期一、什么是生命周期二、Vue.js 的生命周期源码工程文件为：一、什么是生命周期生命周期就是指一个对象的生老病死。都是有一个过程的，就是先完成什么，再完成什么，一步一步走完整个生命周期。二、Vue.js 的生命周期当我们使用 new Vue({...}) 的时候，Vue 在背后做了大量工作。根据上图，我们可以知...
2020-04-27 12:54:47
228
原创 Vue.js_04_第一个 Vue 程序
本系列博客汇总在这里：Vue.js 汇总第一个 Vue 程序一、说明关于 var、let 和 const二、Vue.js三、Vue 代码做了什么源码工程文件为：一、说明关于 var、let 和 const以前我们在使用 js 的时候，不管定义变量还是定义常量，我们都使用 var 来进行定义，个人也觉得这种设计不合理，于是 ECMAScript 6 新增 const 和 let 命令...
2020-04-27 12:53:59
326
json需要的jar包.zip
2019-11-30
过滤器.zip
2019-10-25
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人