自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

魏宇轩

对于数组下标应该从0开始还是从1开始,我的0.5折中提议被他们未经认真考虑而拒绝了!...

原创 Vue.js_03_开发工具

本系列博客汇总在这里:Vue.js 汇总 开发工具一、HBiulder X(推荐)二、VsCode(推荐)三、其他 源码工程文件为: 一、HBiulder X(推荐) 下载地址 二、VsCode(推荐) 下载地址 三、其他 略 如有错误,欢迎指正! ...

2020-04-27 13:16:12 32 0

原创 Vue.js_05_列表展示

本系列博客汇总在这里:Vue.js 汇总 列表展示数组存储数据1、直接使用数组名称2、使用数组下标3、v-for 指令初体验 源码工程文件为: 数组存储数据 1、直接使用数组名称 2、使用数组下标 3、v-for 指令初体验 从上面的展示来看,从数组中获取数值是可以做到的,那是不是也可以...

2020-04-27 13:15:53 23 0

原创 Vue.js_06_计数器案例

本系列博客汇总在这里:Vue.js 汇总 计数器案例一、功能说明二、methods 和 v-on:click1、methods2、v-on:click 源码工程文件为: 一、功能说明 点击加号实现计数器增一,点击减号实现计数器减一。 上图中的代码已经实现了计数器的功能,但是如果行的需求出现...

2020-04-27 13:15:43 18 0

原创 Vue.js_30_组件双向绑定案例

本系列博客汇总在这里:Vue.js 汇总 组件双向绑定案例 源码工程文件为: 注意: 修改后: 最终效果: 效果图 完整代码: <!DOCTYPE html> <html> <head> <meta charset="utf-...

2020-04-27 13:15:25 18 0

原创 Vue.js_00_ES6 语法

本系列博客汇总在这里:Vue.js 汇总 ES6 语法一、什么是 ES6?二、let/var 关键字三、const 关键字四、对象字面量的增强写法1、属性的增强写法2、函数的增强写法 源码工程文件为: 一、什么是 ES6? ECMAScript 6(简称 ES6)是于 2015 年 6 月正...

2020-04-27 13:07:18 23 0

原创 Vue.js_26_小案例

本系列博客汇总在这里:Vue.js 汇总 小案例一、需求说明二、代码实现1、style.css2、demo.html3、main.js三、实现效果 源码工程文件为: 一、需求说明 购物车。 二、代码实现 1、style.css table { border: 1px solid #e9...

2020-04-27 13:07:06 32 0

原创 Vue.js_24_数组中的常用方法

本系列博客汇总在这里:Vue.js 汇总 v-show 指令一、说明及使用方法 源码工程文件为: 一、说明及使用方法

2020-04-27 13:06:54 60 0

原创 Vue.js_27_JavaScript 高阶函数的使用

本系列博客汇总在这里:Vue.js 汇总 JavaScript 高阶函数的使用一、for二、filter三、map四、reduce五、结合使用 源码工程文件为: 一、for 二、filter 三、map 四、reduce 五、结合使用 如有错误,欢迎指正! ...

2020-04-27 13:06:40 52 0

原创 Vue.js_28_v-model 指令

本系列博客汇总在这里:Vue.js 汇总 v-model 指令使用说明 源码工程文件为: 使用说明 表单控件在实际开发中是非常常见的。特别是对于用户信息的提交,需要大量的表单。Vue 中使用 v-model 指令来实现表单元素和数据的双向绑定。 案例的解析: 当我们在输入框输入内容时,因为...

2020-04-27 13:06:28 17 0

原创 Vue.js_29_组件化开发

本系列博客汇总在这里:Vue.js 汇总 组件化开发一、什么是组件化?二、Vue 组件化思想三、注册组件的基本步骤四、注册组件步骤解析1、Vue.extend()2、Vue.component()3、组件必须挂载在某个 Vue 实例下,否则它不会生效五、全局组件和局部组件六、父组件和子组件七、注册...

2020-04-27 13:06:15 78 0

原创 Vue.js_31_父子组件的访问方式

本系列博客汇总在这里:Vue.js 汇总 父子组件的访问方式一、$children二、$refs三、$parent 和 $root 源码工程文件为: 一、$children 有时候我们需要父组件直接访问子组件,子组件直接访问父组件,或者是子组件访问跟组件。 父组件访问子组件:使用 $chi...

2020-04-27 13:06:02 30 0

原创 Vue.js_32_插槽(slot)的使用

本系列博客汇总在这里:Vue.js 汇总 @TOC 源码工程文件为: 一、为什么使用插槽? 在生活中很多地方都有插槽,电脑的 USB 插槽,插板当中的电源插槽。插槽的目的是让我们原来的设备具备更多的扩展性。比如电脑的 USB 我们可以插入 U 盘、硬盘、手机、音响、键盘、鼠标等等。 组件的插...

2020-04-27 13:05:50 20 0

原创 Vue.js_33_前端模块化开发思想

本系列博客汇总在这里:Vue.js 汇总 前端模块化开发一、JavaScript 原始功能二、CommonJS(了解)三、exportn 基本使用四、导出函数或类五、export default六、import 使用 源码工程文件为: 一、JavaScript 原始功能 在网页开发的早期,j...

2020-04-27 13:05:39 106 0

原创 Vue.js_34_Webpack 详解

本系列博客汇总在这里:Vue.js 汇总 Webpack 详解一、认识 webpack1、什么是 webpack?2、前端模块化3、打包如何理解呢?4、和 grunt/gulp 的对比二、webpack 的安装1、查看自己的 node 版本2、全局安装 webpack3、局部安装 webpack(...

2020-04-27 13:05:03 35 0

原创 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 初始化...

2020-04-27 13:04:52 27 0

原创 Vue.js_36_ 箭头函数的使用和 this 指向

本系列博客汇总在这里:Vue.js 汇总 箭头函数的使用和 this 指向一、箭头函数二、this 指向 源码工程文件为: 一、箭头函数 箭头函数: 也是一种定义函数的方式。 二、this 指向 <!DOCTYPE html> <html lang="en&q...

2020-04-27 13:04:42 38 0

原创 Vue.js_37_vue-router 详解

本系列博客汇总在这里:Vue.js 汇总 vue-router 详解一、认识路由1、后端路由阶段2、前端路由阶段前后端分离阶段单页面富应用阶段3、URL 的 hash4、HTML5 的 history 模式pushStatereplaceStatego补充说明二、vue-router 基本使用1、...

2020-04-27 13:04:31 49 0

原创 Vue.js_38_TabBar 案例

本系列博客汇总在这里:Vue.js 汇总 TabBar 案例 源码工程文件为: 如有错误,欢迎指正!

2020-04-27 13:04:18 30 0

原创 Vue.js_39_Promise

本系列博客汇总在这里:Vue.js 汇总 Promise一、什么是 Promise 呢?二、网络请求的回调地狱三、定时器的异步事件四、定时器异步事件解析五、Promise 三种状态六、Promise 链式调用 源码工程文件为: 一、什么是 Promise 呢? Promise 是异步编程的一...

2020-04-27 13:03:53 29 0

原创 Vue.js_40_Vuex 详解

本系列博客汇总在这里:Vue.js 汇总 Vuex 详解一、Vuex 是做什么的?二、管理什么状态呢?三、单界面的状态管理四、多界面状态管理五、Vuex 核心概念1、State 单一状态树2、Getters 基本使用3、Mutation 状态更新4、Mutation 传递参数5、Mutation ...

2020-04-27 13:03:35 44 0

原创 Vue.js_41_ 网络请求(axios)

本系列博客汇总在这里:Vue.js 汇总 网络请求一、选择什么网络模块?1、选择一:传统的 Ajax2、选择二:jQuery-Ajax3、选择三:Vue-resource4、选择四:axios二、jsonp三、axios 框架的使用1、安装1、功能特点2、axiox 请求方式四、全局配置五、常见的...

2020-04-27 13:02:50 41 0

原创 Vue.js_25_小练习

本系列博客汇总在这里:Vue.js 汇总 小练习一、需求说明二、代码实现 源码工程文件为: 一、需求说明 点击那个选项,那个就变成红色,也就是所谓的选中状态。 二、代码实现 <!DOCTYPE html> <html lang="en"> &l...

2020-04-27 12:59:11 24 0

原创 Vue.js_23_v-for 指令

本系列博客汇总在这里:Vue.js 汇总 v-for 指令一、v-for 遍历数组二、v-for 遍历对象 源码工程文件为: 一、v-for 遍历数组 当我们有一组数据需要进行渲染时,我们就可以使用 v-for 来完成。 v-for 的语法类似于 JavaScript 中的 for 循环。 ...

2020-04-27 12:59:00 21 0

原创 Vue.js_22_v-show 指令

本系列博客汇总在这里:Vue.js 汇总 v-show 指令一、说明及使用方法二、v-if 和 v-show 对比 源码工程文件为: 一、说明及使用方法 v-show 的用法和 v-if 非常相似,也用于决定一个元素是否渲染。 二、v-if 和 v-show 对比 v-if 和 v-sho...

2020-04-27 12:58:49 31 0

原创 Vue.js_21_条件渲染案例

本系列博客汇总在这里:Vue.js 汇总 条件渲染案例一、案例说明及实现二、input 复用问题1、存在问题2、问题解答3、解决方案三、for 属性补充说明 源码工程文件为: 一、案例说明及实现 用户再登录时,可以切换使用用户账号登录还是邮箱地址登录。 如下: 二、input 复用问题 1...

2020-04-27 12:58:37 21 0

原创 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...

2020-04-27 12:58:11 19 0

原创 Vue.js_19_v-on 指令

本系列博客汇总在这里:Vue.js 汇总 v-on 指令一、事件监听二、v-on 基础三、v-on 参数四、v-on 修饰符 源码工程文件为: 一、事件监听 在前端开发中,我们需要经常和用于交互。这个时候,我们就必须监听用户发生的时间,比如点击、拖拽、键盘事件等等。 在 Vue.js 中如何...

2020-04-27 12:57:03 21 0

原创 Vue.js_18_计算属性和 methods 的对比

本系列博客汇总在这里:Vue.js 汇总 计算属性和 methods 的对比对比说明 源码工程文件为: 对比说明 当我们学完计算属性和 methods 以后,我们可能会考虑这样的一个问题: methods 和 computed 看起来都可以实现我们的功能,那么为什么还要多一个计算属性这个东...

2020-04-27 12:56:50 20 0

原创 Vue.js_17_计算属性

本系列博客汇总在这里:Vue.js 汇总 计算属性一、什么是计算属性?二、计算属性的复杂操作三、计算属性的 setter 和 getter 源码工程文件为: 一、什么是计算属性? 我们知道,在模板中可以直接通过插值语法显示一些 data 中的数据。但是在某些情况,我们可能需要对数据进行一些转...

2020-04-27 12:56:36 22 0

原创 Vue.js_16_v-bind 指令动态绑定 Style

本系列博客汇总在这里:Vue.js 汇总 v-bind 指令v-bind:style1、对象语法2、数组语法 源码工程文件为: v-bind:style 我们可以利用 v-bind:style 来绑定一些 CSS 内联样式。在写 CSS 属性名的时候,比如 font-size,我们可以使用驼...

2020-04-27 12:56:22 19 0

原创 Vue.js_15_v-bind 指令动态绑定 Class

本系列博客汇总在这里:Vue.js 汇总 v-bind 指令一、使用说明二、v-bind 的基本使用三、v-bind 绑定 class1、对象语法用法一用法二用法三用法四2、数组语法用法一用法二用法三用法四 源码工程文件为: 一、使用说明 前面我们学习的指令主要作用是将值插入到我们模板的内容...

2020-04-27 12:56:10 80 0

原创 Vue.js_14_v-cloak 指令

本系列博客汇总在这里:Vue.js 汇总 v-cloak 指令使用场景 源码工程文件为: 使用场景 在某些情况下,我们浏览器可能会直接显示出未编译的 Mustache 标签,就像下面这样的。 这种情况我们也是可以做出调整的,如下: 如有错误,欢迎指正! ...

2020-04-27 12:55:59 9 0

原创 Vue.js_13_v-pre 指令

本系列博客汇总在这里:Vue.js 汇总 v-pre 指令使用说明 源码工程文件为: 使用说明 v-pre 用于跳过这个元素和它子元素的编译过程,用于显示原本的 Mustache 语法。 比如下面的代码: 如有错误,欢迎指正! ...

2020-04-27 12:55:47 15 0

原创 Vue.js_12_v-text 指令

本系列博客汇总在这里:Vue.js 汇总 v-text 指令使用说明 源码工程文件为: 使用说明 v-text 作用和 Mustache 比较相似:都是用于将数据显示在界面中。 v-text 通常情况下,接受一个 string 类型。 如下: 如有错误,欢迎指正! ...

2020-04-27 12:55:36 8 0

原创 Vue.js_11_v-html 指令

本系列博客汇总在这里:Vue.js 汇总 v-html 指令使用场景 源码工程文件为: 使用场景 在某些情况下,我们从服务器请求到的数据本身就是一个 HTML 代码,如果我们直接通过 {{ }} 来输出,会将 HTML 代码也一起输出。但是我们可能希望的是按照 HTML 格式进行解析,并且显...

2020-04-27 12:55:25 19 0

原创 Vue.js_10_v-once 指令

本系列博客汇总在这里:Vue.js 汇总 v-once 指令使用场景 源码工程文件为: 使用场景 在某些情况下,我们可能不希望界面随意的跟随改变,这个时候,我们就可以使用一个 Vue 的指令。 v-once: 该指令后面不需要跟任何表达式(比如之前的 v-for 后面是由跟表达式的)。 该...

2020-04-27 12:55:11 23 0

原创 Vue.js_09_Mustache 语法

本系列博客汇总在这里:Vue.js 汇总 Mustache 语法Mustache 语法 源码工程文件为: Mustache 语法 如何将 data 中的文本数据,插入到 HTML 中呢? 我们已经学习过了,可以通过 Mustache 语法(也就是双大括号)。 如有错误,欢迎指正! ...

2020-04-27 12:54:57 21 0

原创 Vue.js_08_Vue 的生命周期

本系列博客汇总在这里:Vue.js 汇总 Vue 的生命周期一、什么是生命周期二、Vue.js 的生命周期 源码工程文件为: 一、什么是生命周期 生命周期就是指一个对象的生老病死。都是有一个过程的,就是先完成什么,再完成什么,一步一步走完整个生命周期。 二、Vue.js 的生命周期 当我们...

2020-04-27 12:54:47 32 0

原创 Vue.js_04_第一个 Vue 程序

本系列博客汇总在这里:Vue.js 汇总 第一个 Vue 程序一、说明关于 var、let 和 const二、Vue.js三、Vue 代码做了什么 源码工程文件为: 一、说明 关于 var、let 和 const 以前我们在使用 js 的时候,不管定义变量还是定义常量,我们都使用 var 来...

2020-04-27 12:53:59 28 0

原创 Vue.js_07_Vue 中的 MVVM

本系列博客汇总在这里:Vue.js 汇总 Vue 中的 MVVM一、什么是 MVVM二、案例分析 源码工程文件为: 一、什么是 MVVM MVVM 是 Model-View-ViewModel 的简写。它本质上就是 MVC 的改进版。MVVM 就是将其中的 View 的状态和行为抽象化,让我...

2020-04-27 12:53:36 56 0

提示
确定要删除当前文章?
取消 删除