- 博客(28)
- 收藏
- 关注
RSS订阅原创 Vue — 路由router
路由是Vue的一个插件，专门用来实现SPA应用。什么是SPA？一个路由就是一组映射关系（key - value），了解Vue路由，看这一篇就够了！！！
2022-06-13 20:17:52
576
1
原创 Vue — vuex
* 简单理解，vuex就是一个数据仓库，帮我们保存数据和操作数据的方法，可用模块化+命名的方式存储不同应用场景的数据。* 数据单独存储，这样每个组件都可以读取和操心同一数据，完成组件间通信。* dispatch() => actions{ }* commit() => mutations{ }* 四个map方法用来帮助映射组件中的计算属性，生成与vuex中对象对话的方法* 当state中的数据需要经过加工后再使用时，可以使用getters加工整个vuex的实现流程刚接触起来会比较混乱，API.
2022-06-08 21:53:32
251
原创 Vue—搭建项目脚手架
文章目录一、搭建脚手架步骤1 全局安装@vue/cli2 创建cli3 启动项目二、分析脚手架文件结构总结一、搭建脚手架步骤需要先安装node.js。使用其自带的npm包管理器工具安装脚手架。关于npm可以查看之前博客：关于npm1 全局安装@vue/cli在cmd中使用如下命令全局安装Vue脚手架(第一次安装)npm install -g @vue/cli如出现下载缓慢请配置 npm 淘宝镜像：npm config set registry https://registry.npm.ta
2022-05-14 15:24:47
398
原创 Vue—组件本质—Vue与VueComponent
文章目录前言组件的本质Vue与VueComponent总结前言通过组件的学习，我们发现组件里面的属性和方法与vue实例对象及其的相似，这是什么原因呢？笔者将通过本文阐述一下自己的理解。组件的本质组件本质其实是名为 VueComponent 的构造函数。构造组件时，Vue会自动的帮我们调用Vue.extend() 这个函数，生成一个名为VueComponent 的构造函数。Vue在解析页面时，遇到组件标签，就会帮我们调用这个构造函数创建组件的示例对象，即Vue帮我们执行：new VueComp
2022-05-06 17:25:45
670
1
原创 Vue—组件
文章目录前言一、概念模块和组件单文件组件.vue二、组件的基本使用1、创建组件2、注册组件局部注册全局注册3、编写组件标签组件嵌套总结前言Vue在设计之初借鉴了React框架的组件化编程，将复杂的界面功能封装成一个个的组件，可以大幅提高代码复用率，简化项目编码，提高运行效率。本文简要介绍组件的基本使用。一、概念模块和组件模块。在之前的网页编程中，我们常常将页面某些具体功能的交互部分单独抽离出来，组成一个个.js文件，再将其引入使用，使得编程细化为一个个的模块，构建一个模块化的应用。而Vue
2022-05-06 16:03:13
242
原创 VUE—生命周期
前端开发，简单来讲就是在合适的时间（用户点击等行为）将合适的数据放在页面合适的位置。而Vue为我们提供了八个可以在不同的状态下调用的函数，在关键时刻帮我们调用的这些特殊名称的函数，极大的方便了数据操作。使得程序更有结构化，维护起来也更方便。上述八个生命周期函数在实际开发中最常用的两个为mounted()、beforeDestroy() ，结合上面示意图可以更好的理解使用，方便我们编程时明了何时调用对应函数 该将功能代码放到哪个函数中。
2022-05-05 17:52:12
87
原创 Vue—获取表单值
文章目录前言总结前言本文简要记录如何使用Vue收集常见类型的表单数据，以及不同表单类型收集数据时需要注意的几个点。在Vue中我们通常使用v:model命令绑定表单的属性值（通常是value），获取到的属性值就是表单数据。但是不同类型的表单用此命令收集到的对应属性不同（checked）。需要稍做处理后才能获取到我们实际想要的数据。下图表单中包含了常见的表单类型。不同的表单类型获取表单值的方式也不同。总结提示：这里对文章进行总结：例如：以上就是今天要讲的内容，本文仅仅简单介绍了pandas
2022-05-05 16:13:11
7067
1
原创 Vue—模板语法
Vue — 模板语法文章目录Vue — 模板语法一、插值语法二、指令语法内置指令自定义指令总结一、插值语法功能用于解析标签体内容写法 ： {{xxx}}xxx是js表达式，且可以直接读取到data中的所有属性示例：<h3>你好，{{name}}</h3>二、指令语法功能 : 解析标签属性、解析标签体内容、绑定事件内置指令v-bind : 单向绑定解析表达式, 可简写为 :xxxv-model : 双向数据绑定v-for : 遍历数组/对象/字符串
2022-05-05 15:56:27
121
原创 VUE—初识
文章目录前言一、Vue是什么？二、Vue的特点1.组件化模式2.声明式编码3、使用虚拟DOM+优秀Diff算法三、需要掌握的JavaScript基础知识总结前言正式进入Vue学习啦 ! 尤雨溪大佬我来啦!今天先了解一下Vue的基本概念,以便之后更好地深入学习Vue一、Vue是什么？Vue是一套用于构建用户界面的渐进式JavaScript框架。渐进式呢可以理解为从简单应用(只需一个轻量小巧的核心库)逐渐递进到复杂应用(可以引入各式各样的Vue插件)二、Vue的特点目前市面上的前端框架有很多,
2022-04-22 18:01:23
940
原创 GIT基本概念及使用
文章目录前言一、Git概念1、版本存储方式——记录快照2、操作执行——本地执行3、管理分区及文件状态4、Git基本工作流程二、Git的基本使用1.安装并配置GitGit安装配置用户信息全局配置文件获取帮助信息2.Git基本使用创建本地项目Git仓库1) 初始化仓库2）工作区中的文件状态3）Git操作命令Github开源项目托管平台总结前言本文介绍了Git版本控制系统的基本概念及一些Git命令。使用Git管理项目版本有助于提高团队开发的效率。一、Git概念Git是一个开源的分布式版本控制系统,可以
2022-04-21 14:04:36
475
原创 关于npm
文章目录一、Node.js是什么用来干嘛？二、npm是什么用来干嘛？三、npm初始化生成配置文件四、npm命令写在最后一、Node.js是什么用来干嘛？Node.js 是一个软件。它和浏览器一样可以运行JavaScript代码。通常使用它来构建服务器端的应用和创建前端工程化工具，用于开发各种web服务器.二、npm是什么用来干嘛？我们之前使用jQuery、Bootstrap时，需要到其各自网站上下载对应jQuery、Bootstrap的代码，这些可以使用的代码被称为包，使用时需要到各自网站上下载代
2022-04-15 20:06:31
1060
原创 HTTP知识点概览
文章目录一、HTTP协议简介二、HTTP请求1.什么是HTTP请求消息2.HTTP请求消息的四个组成部分- 请求行- 请求头部- 空行- 请求体三、HTTP响应1.什么是HTTP响应消息2.HTTP响应消息的4个组成部分- 状态行- 响应头部- 空行- 响应体四、HTTP请求方法五、HTTP请求状态码一、HTTP协议简介HTTP协议即超文本传送协议（Hyper Text Transfer Protocol），它规定了客户端与服务器之间进行网页内容传输时，所必须遵守的传输格式。HTTP协议采用了 请求/
2022-04-11 10:29:33
956
原创 HTTP响应状态码总结
HTTP请求方法每个服务器必须有GET和HEAD请求方式。HTTP响应状态码的组成及分类总结每个服务器都至少支持GET和HEAD请求方式。浏览器可以根据服务器返回的响应状态码得知此次HTTP请求的结果时否成功可以根据状态码的类型分辨此次请求不成功的错误原因。...
2022-04-09 11:34:27
373
原创 Ajax提交form表单数据
文章目录前言一、form表单介绍1.什么是表单2.表单form的组成部分3.表单form的属性4.表单的同步提交二、Ajax 提交表单数据1.监听表单的提交事件2.阻止表单的默认提交行为3.快速获取表单中的数据4.通过Ajax请求提交表单数据给服务器总结前言本文介绍了表单的基本使用及属性说明,通过Ajax请求方式将网页表单数据提交到服务器的具体实现过程，代码实现在文章末尾。一、form表单介绍1.什么是表单表单在网页中主要负责数据采集功能,采集用户输入信息提交到服务器端进行处理。常见登陆注册页
2022-04-08 18:54:56
9930
4
原创 边框图片_九宫格切图
边框图片原理示意图：九宫格切图法,保留四个角边框样式,拉伸平铺或环绕方式设置图片四条边.以达到边框样式相同大小可以改变的效果组合写法：border-image: url("images/border.jpg") 167/20px round;拆分写法：border-image-source: url("images/border.jpg"); /*边框图片资源地址*/ border-image-slice: 167 167 167 167; /* 裁剪尺寸（上 右 下 左）单位默认
2022-03-28 17:36:55
732
原创 5个步骤上手ECharts
文章目录前言在这里插入图片描述一、Echarts是什么？二、使用五部曲1、下载并引入echarts.min.js2、准备一个有大小的DOM容器3、初始化echarts实例对象4、指定配置项和数据基础配置5、将配置项设置给echarts实例对象总结前言枯燥的数据看起来索然无味,那么会动的数据会不会让你眼前一亮呢ECharts插件可以帮助我们让数据可视化,通过各种图表让数据一目了然今天花五分钟事件来了解一下这个炫酷的插件吧一、Echarts是什么？一个兼容主流浏览器，性能好，可流畅运行于PC与移
2022-03-28 16:13:18
1659
原创 jQuery初体验 —— 本地存储方式实现ToDoList
文章目录前言一、ToDoList 案例介绍二、ToDoList 案例分析1.本地存储数据2.页面渲染三、案例实现总结前言终于学到jQuery啦！今天通过实现ToDoList这个小案例来练习一下jQuery的使用，顺便复习一下本地存储。（源码在文末）一、ToDoList 案例介绍文本框里面输入内容，按下回车，就可以生成待办事项。点击待办事项复选框，就可以把当前数据添加到已完成事项里面。点击已完成事项复选框，就可以把当前数据添加到待办事项里面。本页面内容刷新页面不会丢失。最终效果如下图所
2022-03-17 11:32:58
1535
原创 项目三《小米官网仿写》
小米官网原生js仿写/ / HTML+CSS+JavaScript配合实现页面交互效果 // 整体感知页面组成 // 小米官方仿写部分功能实现方法分享
2022-03-10 20:17:50
1779
原创 JavaScript—DOM事件及案例思路总结
文章目录前言案例思路及实现案例一 分时问候案例二 仿京东显示密码总结前言代码谁都能敲，但不是谁都会敲。电脑执行有很强的逻辑性，要想把我们所需的效果通过代码表达出来，还需要清楚整个事件的具体过程。代码已经敲的很多了，但是具体敲代码的逻辑思想才是解题的关键。本文记录了几个案例的编程思想，可以跟随思路在脑海中过一遍代码方法，下面一起来看看吧！提示：以下是本篇文章正文内容，下面案例可供参考案例思路及实现案例一 分时问候案例描述根据不同事件，页面显示不同图片，同时显示不同的问候语如上午打开页面.
2021-12-29 17:42:59
934
2
原创 JavaScript __ 对象小记
JavaScript __ 对象小记文章目录JavaScript __ 对象小记前言一、对象的组成二、JavaScript中的三种对象1.自定义对象三种创建对象的方法1）字面量创建对象2）利用new Object创建对象3）利用构造函数创建对象关键字new的作用对象的使用方法遍历对象2、内置对象Math数学对象Date日期对象数组对象——创建数组对象的两种方式1 利用字面量创建2 利用 new Array()—— 检测是否为数组的两种方法1 instanceof 运算符2、Array.isArray(参
2021-12-23 22:17:23
503
1
原创 JavaScript——关于预解析的那点小事
什么是预解析JavaScript属于编程语言，JavaScript 代码是由浏览器中的 JavaScript 解析器来执行的。JavaScript 解析器在运行 JavaScript 代码的时候分为两步：预解析和代码执行。预解析：在当前作用域下, JS 代码执行之前，浏览器会默认把带有 var 和 function 声明的变量在内存中进行提前声明或者定义。代码执行： 从上到下执行JS语句。预解析会把变量和函数的声明在代码执行之前执行完成。预解析也叫做变量、函数提升。变量提升（变量预解析）：
2021-12-22 14:43:35
366
原创 JavaScript 基础语法循环案例练习
JavaScript 基础语法循环案例练习文章目录JavaScript 基础语法循环案例练习前言一、早午晚安喵喵喵二、判断奇偶数三、班长请客四、1-100跳过个位为3的数求和五、第几个能被7和3整除的数六、双重for循环矩形三角形七、九九乘法表八、ATM机九、冒泡排序总结前言之前学习HTML语言属于标记语言，不用向计算机发出指令，常用于格式化和链接，标记语言是用来被读取的，是被动的。而现在学习的JavaScript则属于编程语言，包含很多逻辑性和行为能力的指令。本文记录初入JavaScript时练
2021-12-16 21:37:15
1153
1
原创 移动web开发_响应式bootstrap框架布局小记
移动web开发_bootstrap框架响应式布局文章目录移动web开发_bootstrap框架响应式布局前言一、响应式布局二、bootstrap是什么？二、bootstrap的使用1、创建文件夹结构2.创建HTML骨架结构 引入相关样式文件3、书写内容布局容器栅格系统总结前言bootstrap是目前前端开发比较主流的开发框架之一.借助bootstrap框架,我们可以省去一些繁琐的样式书写,在它为我们提供的基础样式上增加我们自己需要的样式,快速的开发出一个简洁美观的网页.本文对bootstrap框
2021-12-14 11:16:11
1081
原创 移动web开发_rem布局小记
移动web开发_rem布局小记文章目录移动web开发_rem布局小记前言一、rem是什么？二、rem实际开发适配方案开发原理方案一： rem + 媒体查询 + less媒体查询Less基础Less简介Less的使用1、Less变量2、Less嵌套3、Less运算方案一实现方案二：flexible.js + rem总结前言移动web开发之rem适配布局，本文记录了两种前端开发rem适配布局方案提示：以下是本篇文章正文内容，下面案例可供参考一、rem是什么？rem (root em)是
2021-12-08 17:04:54
300
1
原创 移动web开发_Flex布局小记
移动web开发_Flex布局文章目录移动web开发_Flex布局前言一、Flex布局原理二、Flex布局优缺点三、Flex属性1、父项常见属性display：flex； 开启flex布局flex-direction：设置主轴的方向justify-content：设置主轴上的子元素排列方式flex-wrap：设置子元素是否换行flex-flow：复合属性，相当于同时设置了 flex-direction 和 flex-wrapalign-content：设置侧轴上的子元素的排列方式（多行）align-it
2021-12-03 16:09:54
231
原创 Float浮动 及 清除浮动
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、什么是浮动Float？二、为什么需要浮动？三、浮动的特性1.具有行内块元素的特性2.脱标四、浮动可能产生的影响1、后续标准流被覆盖2、父级盒子高度塌陷问题五、清除浮动1、额外标签法（隔墙法）2、父级添加 overflow 属性3、父级添加after伪元素4、父级添加双伪元素总结前言本篇文章总结了float可能对布局产生的影响及清除浮动的方法提示：以下是本篇文章正文内容，下面案例可供参考一、什么是浮动Float？
2021-11-17 21:55:31
874
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人