自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(26)
  • 收藏
  • 关注

原创 Ant Design of Vue Model 改变原始样式

这段时间写vue的项目用Ant Design作为ui,很多原始样式需要修改。写vue项目,因为是直接调用组件,比较无脑,但有些样式还是需要自定义,但是因为作用域和优先级问题,走了很多弯路,浪费了大量时间。在修改原始组件样式时,很可能直接使用组件里的类名时不能修改样式如图,完全没用这时候就需要用到深度作用选择器使用类名如图,改变了样式,添加了滚动条...

2021-07-13 21:49:45 386

原创 vue提交数据到数据库

只在前端调用添加数据的接口的话,提交数据是非常简单的前端人员在看接口文档的时候一定要看清楚参数,比如下面的两个接口文档这里的参数名称是json,值是json字符串,而不是json对象,所以这里是一个参数,参数名是json而这里的参数名称是json对象,这里就有多个参数,以多个键值对的方式传递首先想要调用接口,先声明接口之后在自己的组件中定义最后在methods中写方法,在里面按照规定传参...

2021-07-11 20:52:46 2205 1

原创 vue插槽详解

Vue插槽,是学习vue中必不可少的一节,下面以几个方面来说下一、插槽内容其实可以用一句话概括:插槽内可以是任意内容。先看一下下面的代码:声明一个child-component组件,如果现在我想在<child-component></child-component>内放置一些内容,结果会是怎样?<div id="app"> <child-component></child-component></div><

2021-04-25 19:03:41 211

原创 vue常见指令的使用

vue指令的特点​ 1. 具有特殊含义、拥有特殊功能的特性​ 2. 指令带有v-前缀,表示它们是Vue提供的特殊特性​ 3. 指令可以直接使用data中的数据1、v-html解释:更新dom对象的innerHTML<div id="box"> <div v-html="str"></div></div> <script>var vm = new Vue({ el: "#app", data: {

2021-04-20 20:28:38 98

原创 对form表单的小结

1、form表单标记表单标记以标记开头,以标记结尾。在表单标记中可以定义处理表单数据程序的URL地址等信息。标记的基本语法如下:<form action="url" method="get | post" name="formName" onsubmit="" target=""></form>2、form表单的提交与重置form表单的提交与重置可以通过HTML自带的表单按钮方式,或者使用JavaScript脚本的方式。2.1 使用表单按钮<form id="

2021-04-17 14:09:04 73

原创 再次了解node

在讲 Event Loop (事件循环)之前,我们来说下 node 的东西,来帮助我们更加明白事件循环是干什么的Node 是什么Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,Node 不是一门语言,是让 js 运行在后端的,运行时不包括 js 全集,因为在服务端中不包含 DOM 和 BOM,Node 也提供了一些新的模块,比如 http,fs等模块。Node 解决了什么Node 的首要目标是提供一种简单的,用于创建高性能服务器的开发工具 Web 服务器的瓶颈

2021-04-13 18:57:38 97

原创 express 中日志中间件 morgan

Morgan是一个node.js关于http请求的日志中间件安装模块npm install morgan --save #保存到package.json的依赖列表使用方法在终端打印日志... var logger = require('morgan');...app.use(logger('dev'));...每次http请求,express实例都会输出日志,并且使用一致的格式GET / 200 338.136 ms - 170POST / 404 60.506 ms - 12

2021-04-11 22:37:17 473

原创 markdown-it

最近在写我的个人博客,使用了markdown-it,这篇文章是我对markdown-it的一些解读。markdown-it原理输出一串markdown大妈,最后会的到一串HTML代码,整体流程如下:我们以一个简单的例子来解释整个流程:# 文字 →<h1>文字<h1>首先,它会被解析器拿到,经过各个解析规则处理后的到一个token流,接着这个token流被渲染器拿到,经过各个渲染规则处理后拼接成一个html字符串。解析器markdown-it 内置了七个核心规则,在上图我

2021-04-07 20:58:24 482 1

原创 Node+Express搭建博客小结

这段时间在用node搭建自己的个人博客,看了一下相关的框架,决定使用express框架来搭建自己的博客。目录结构简介app.js应用的初始化文件,包括引入应用程序的基础依赖项、设置视图即view的引擎目录以及模板、设置静态资源路径、配置通用的中间件、引入路由和一些错误处理中间件等。package.json应用的配置文件,文件内包含程序的基础信息、启动脚本和依赖包等。bin/www应用的启动文件,文件内包含引用要启动的应用、设置应用监听的端口和启动http服务等。public/**应用的静态资源文

2021-04-04 20:23:15 176

原创 Express的实现

Express提供了一个轻量级模块,把Node.js的http模块功能封装在一个简单易用的接口中。Express也扩展了http模块的功能,使你轻松处理服务器的路由,响应,cookie和HTTP请求的状态。本篇文章章介绍如何在Node.js应用程序中实现Express充当Web服务器。你将学习如何配置Express服务器,设计路由,并利用Request和Response对象发送和接收HTTP请求。你也将了解如何在Express中实现模板引擎。1,Express入门在Node.js的项目中开始使用Ex.

2021-04-03 18:00:51 107

原创 JS异步加载的方式

今天又在JS异步加载的方式上出错了,所以又来复习一下JS异步加载想要更加深刻的了解异步加载,我就得更深入了解JS加载的时间线,所以我整理了一下我对JS时间线的理解。首先,JS的时间线是在JS出生的那一刻开始记录所有浏览器按照顺序做的事,就是加载的顺序,可以用来优化什么。创建document对象,开始解析web页面遇到link外部css,创建线程加载,并继续解析文档遇到script外部js,并且没有设置async、defer,浏览器加载,并阻塞,等待js加载完成并执行该脚本,然后继续解析文档.

2021-03-27 13:19:38 166 1

原创 高阶函数与函数柯里化

这两天复习了一下数组的map、filter等方法,后面又重新了解了一下高阶函数、函数柯里化,这里简单记录一下高阶函数在我看来就是一个函数可以接受另一个函数作为参数,又把函数作为返回值输出,这样的函数就是高阶函数,就是用一个函数来控制函数。举个例子:定义一个函数fnsum求两个数的和function fnsum(a,b){ return a,b;}但是我像求这两个数绝对值的和,我可以直接在函数fnsum的里面处理,还有一种方法就是利用到高阶函数了function fnsum(a,b,fn.

2021-03-24 20:46:26 124

原创 自己创建一个Promise构造函数

刚学习了promise, promise相当于异步操作结果中的占位符,它不会去订阅一个事件,也不会传递一个回调函数给目标函数,而是让函数返回一个promise,实质上promise是一个构造函数。想更深入了解promise原理,看能不能自己写一个promise构造函数//创建 Promise构造函数function Promise(executor) { // 添加属性 this.PromiseState = 'pending' this.promiseResult = nul

2021-03-21 22:58:22 518

原创 数组的方法小结

1.Array.map 映射 一一对应,返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。 let arr = [1, 2, 3, 4, 5] let arr1 = [] for (var i = 0; i < arr.length; i++) { arr[i] *= 2 // arr1.push(arr[i] *= 2) } console.log(arr) let newArr = arr.map(v => v *

2021-03-20 09:51:05 119

原创 Promise的用法

什么是PromisePromise是异步编程的一种解决方案,其实是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上有then、catch等方法。Promise对象有以下两个特点:对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺

2021-03-11 08:46:40 109

原创 初识canvas

昨天刚学习了SVG,今天又来学习canvas,那么canvas比之SVG又有什么区别呢canvas是html5提供的新元素。而svg存在的历史要比canvas久远,svg并不是html5专有的标签,最初svg是用xml技术 描述二维图形的语言。主要的话是三个区别:1.绘制的图片格式不同2.Canvas不支持事件处理器,SVG支持事件处理器3.适用范围不同canvas的基本语法<canvas></canvas>关于canvas双标签,在页面中开辟一格区域. 可

2021-01-18 20:50:45 102

原创 SVG——环形进度条

刚学了SVG的知识,趁热来使用一下需要用到的知识点:1.圆形标签:circle<circle cx="110" cy="110" r="100" fill="none" stroke="#eee" stroke-width="20"></circle>圆的中心坐标:cx:center x 坐标cy:center y 坐标圆的半径:r:radius 半径颜色:fill:填充色fill:none //无填充stroke:边框颜色stroke-wi

2021-01-13 09:09:14 253

原创 LESS的使用

less入门1.less是什么?less是一种动态样式语言,属于css预处理器的范畴,它扩展了css语言,增加了变量、Mixin(混合)、函数等特性,使css更具维护和扩展less既可以在客户端上运行,也可以借助node.js在服务器运行2.变量在less中@width: 10px;@height: @width + 10px;#header { width: @width; height: @height;}在CSS中编译为#header { width: 10px;

2021-01-07 19:22:10 150

原创 javaScript学习笔记

JavaScript的组成ECMAScript - JavaScript的核心定义了JavaScript 的语法规范JavaScript的核心,描述了语言的基本语法和数据类型,ECMAScript是一套标准,定义了一种语言的标准与具体实现无关BOM - 浏览器对象模型一套操作浏览器功能的API通过BOM可以操作浏览器窗口,比如:弹出框、控制浏览器跳转、获取分辨率等DOM - 文档对象模型一套操作页面元素的APIDOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操

2020-12-28 18:37:02 69

原创 JavaScript中的正则表达式

1.什么是正则表达式正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个“规则字符串”,这个规则字符串用来表达对字符串的一种过滤规则。2.什么时候用到正则表达式假设用户需要在html表单中填写姓名、地址、邮箱等,那么在将表单提交到服务器进一步处理前,js程序会检查表单,确定用户提交的信息是符合要求的。这时候就要用到正则表达式3.为什么要用正则表达式(目的)?匹配:给定的字符串是否符合正则表达式的过滤逻辑可以通过正则表达式,从字符串中获取我们想要的

2020-12-24 18:43:10 160

原创 CSS入门——第三章

10 布局的三种机制普通流(标准流): 块级元素会独占一行,从上向下顺序排列; 常用元素:div、hr、p、h1~h6、ul、ol、dl、form、table 行内元素会按照顺序,从左到右顺序排列,碰到父元素边缘则自动换行;常用元素:span、a、i、em等浮动: 让盒子从普通流中浮起来,主要作用让多个块级盒子一行显示。定位: 将盒子定在浏览器的某一个位置——CSS 离不开定位,特别是后面的 js 特效。 什么是浮动以及浮动的特点(float)(重

2020-12-17 18:38:10 81

原创 CSS入门——第二章

6 背景属性背景颜色:background-color背景图片:background-image背景平铺:background-repeat背景位置:background-postition背景附着:background-attachment7 css三大特性层叠性:相同的选择器设置相同的样式,此时一个样式就会覆盖另一个冲突的样式原则:样式冲突,就近原则进行执行(覆盖);继承性:子标签会继承父标签中的某些样式,如文本的颜色和字号子元素可以继承父元素的样式:text-、font-、line

2020-12-13 20:32:45 142

原创 CSS入门——第一章

CSS入门——第一章1.三种书写位置行内样式表:一行标签之内,直接书写在标签的style属性里。内嵌样式表:写在<head>的<style>下,然后通过选择器选取要作用的标签。外联样式表:将内容写在一个外部样式表中(.css)用<link href=“XXX.css” type=“text/css” rel=“stylesheet”/>2.文本样式文本对齐 text-align字间隔 word-spacing缩进文本 text-indent字符转换

2020-12-13 20:30:39 112

原创 前端从HTML开始——表单验证

HTML表单表单是以<form>元素作为容器,我们可在其中设置基本的提交特性1、表单的组成一个表单有三个基本组成部分:表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用 表单按钮来控制其他定义了处理脚本的处理工作。表单标签及属性<form&gt

2020-12-09 19:35:57 205

原创 前端从HTML开始——表格与列表

HTML知识点HTML表格结构 <table border="1"> <tr> <th>姓名</th> <th>年龄</th> <th>性别</th> </tr> <tr> <td>张三</td> <td>18</td> <td>男</td> <

2020-12-07 20:22:36 127

原创 前端从HTML开始

从HTML开始

2020-12-06 19:00:48 53

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

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