自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue3.x 新特性

vue3.x 新特性1.Vue3.0六大亮点Performance:性能比Vue 2.x快1.2~2倍Tree shaking support:按需编译,体积比Vue2.x更小Composition API: 组合API(类似React Hooks)Better TypeScript support:更好的 Ts 支持Custom Renderer API:暴露了自定义渲染APIFragment, Teleport(Protal), Suspense:更先进的组件2.Vue3.0是如何变

2020-11-19 19:46:39 7

原创 父子组件间以及兄弟间的通信

如何进行父子组件间以及兄弟间的通信呢?父子通信:通过props向子组件传递数据子父通信:通过事件向父组件发送消息在组件中,使用选项props来声明需要从父级接收到的数据。props的值有两种方式:方式一:字符串数组,数组中的字符串就是传递时的名称。方式二:对象,对象可以设置传递时的类型,也可以设置默认值等。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">

2020-11-06 16:04:12 34

原创 component组件

什么是组件?组件(Component)是Vue js最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码。在较高层面上,组件是自定义元素,Vue js 的编译器为它添加特殊功能。在有些情况下,组件也可以表现为用is 特性进行了扩展的原生HTML元素。所有的Vue组件 同时也都是Vue的实例,所以可接受相同的选项对象(除了一些根级特有的选项)并提供相同的生命周期钩子。vue组件分为:局部组件:只能在el定义的范围内使用,全局组件:可以在随意地方使用父子组件:之间的传值问题。父子(属性通信)

2020-11-06 15:22:35 12

原创 vue-cli 2 低版本的问题

vue-cli 2 低版本的问题当Vue-cli >= 3和旧版本使用相同的vue命令时,低版本的Vue-cli 2会被覆盖。如果仍然需要使用旧版本的 vue init功能,可以全局安装一个桥接工具。npm install -g @vue/cli-initvue init webpack my-project...

2020-11-04 20:49:51 10

原创 Vue-cli的安装及使用

Vue-cli的安装方法一:npm install -g @vue/cliyarn global add @vue/cli检测版本:vue --versionvue-cli的基本使用vue create app_name(命令行)vue ui(图形化界面)vue --help 检测vue提供哪些命令1.vue create app_name(命令行)![在这里插入图片描述](https://img-blog.csdnimg.cn/20201104194635546.p

2020-11-04 20:19:32 13

原创 安装Vue时常见问题及解决方案

安装Vue时常见问题及解决方案yarn 无法安装 vue@cliyarn 没有正确的安装yarn 有安装,但是没有正确安装,命令找不到yarn 安装的全局命令无法使用cmd 启动的用户身份不对(超级管理员)目录中出现中文或者空格目录中出现部分的特殊字符或者全部大写问题一的解决方案安装yarn:npm install -g yarn检测默认安装的目录:npm config listbuiltin config undefined 代表 npm 安装的全局包所处的目录,需要将该目录加入

2020-11-04 12:00:28 55

原创 watch和computed及其的区别

watch和computed及其的区别computed(计算属性)computed:计算属性,依赖其他的属性值,计算属性是取返回值作为最新结果,所以里面不能异步的返回结果。不能写异步逻辑。Watch(监听属性)Watch:更多的是一种观察的作用,用于监听某些数据的回调。每当所监听的数据发生变化时才能执行回调处理后续操作。watch :里面监视某个模型变量的变化,接受的值,是一个函数参数1:代表是变化后最新的值参数2:代表是变化之前的旧值总结:1.computed中的函数必须要调用retur

2020-10-30 10:49:06 36

原创 filter 过滤器

需求: 前端编写一个输入框,用户输入英文字母后,需要将其转换为大写进行页面显示。变量 toUpperCase() 转换为大写一些简单的业务逻辑,在插值表达式里面是可以完成的。但是需要注意,开发理念不建议在插值表达式里面书写太多的业务代码,纯粹的输出。 如果有业务代码建议做其他的一些操作,例如定义函数处理。语法: 模型变量 | 过滤器(vuejs提供一些特殊的标识符,函数)表现形式:拿 | 前面的操作的返回结果作为输出 | 后面的输入类似Linux操作系统里面的 管道 类似 php里面的 s

2020-10-28 22:25:50 8

原创 v-show和v-if及区别

v-show指令的作用是:根据真假切换元素的显示状态。原理是修改元素的display,实现显示隐藏。指令后面的内容,最终都会解析为布尔值,值为true元素显示,值为false元素隐藏。数据改变之后,对应元素的显示状态会同步更新。<body> <div id="app"> <img v-show="isShow" src="../images/angel.gif" alt=""> <input type="butto

2020-10-27 09:50:20 14

原创 Vue.js模板

<!DOCTYPE html><html lang="zh_CN"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div id="app"></div></body><script src="https://cdn.jsdelivr.net/npm/v

2020-10-26 17:27:32 8

原创 密码学——MD5

MD5(中文名为消息摘要算法第五版)为计算机安全领域广泛使用的一种散列函数,用以提供消息的完整性保护。一般我们的网站业务里面都是使用的 md5sha1 进行信息的加密:需要注意:并不是意味着只有md5加密md5不算加密,只是算获取信息的摘要值,提取信息的特征值,一般做数据的完整性校验。由于md5 拥有三个特点:单向不可逆相同的输入给出相同的输出还可以混淆信息加密就意味着可以解密。常见加密方式: 1. 对称加密 2. 非对称加密密文的传统方式: 数据库存的是密文用户提交的是明

2020-10-22 17:59:09 31

原创 Node.js中出现的问题

学习Node.js中出现的问题的集合1. exec() 方法模型.find({查询条件}).exec( (error, data) => {} ); exec(execute)方法是文档提供的。 http://www.mongoosejs.net/docs/models.html2. 数据未显示通过模型查询回来的数据没办法在视图上面进行循环遍历原因:通过网上的资料查询得到mongoose里面的对象并不是js里面传统的对象,而是由mongoose进行封装的对象,要和我们之前定义的Model相对

2020-10-22 17:05:36 20

原创 Express 应用程序生成器

1、npm install -g express-generator2、express -h3、express --view=ejs myapp4、5、6、

2020-10-21 22:09:02 12

原创 express-art-template

在Express中配置使用art-template下载命令:npm install art-template express-art-template(npm install --save art-template、npm install --save express-art-template)虽然不需要直接require art-template,但是由于express-art-template需要art-template,因此也必须安装art-template.engine函数:用来配置art-

2020-10-21 20:08:08 13

原创 art-template 模板引擎

模板引擎可以把我们的 js 里面的变量或者数据放置在外部的页面里面。    底层实现:正则+替换    具体:    1. 我们外置的页面一般我们叫做模板,模板里面一般会放置很多的占位符。占位符值得是后面可以通过变量替换出来的。    2. 使用模板引擎,把那些占位符通过变量替换出来。{{ kw }} 形如这样的结构叫做占位符,也可以叫做

2020-10-20 21:03:59 24

原创 Node.js Express 框架

express 是什么?express 是一些开发基于nodejs的核心模块 http 模块进行额外的封装一个的一个 web 开发框架,使用 express 可以更加快速和方便开发web项目。//1.引入express框架const express = require('express');//2. 创建express实例app 与http.createServer() 类似const app = express();const port = 3000;//3. app请求方式(get p

2020-10-20 16:30:53 24

原创 Node.js的下载与安装

Node.js的下载与安装下载地址: http://nodejs.cn/download/下载软件后,双击软件,全程下一步即可安装完成:安装成功后,Windows + r 键 —> 打开命令行,输入 : node --version 或者 node -v (显示node的版本号)...

2020-10-19 19:53:58 13

原创 Node.js基础知识(一)

Node.JS 基本概念下载地址: http://nodejs.cn/download/Node.js 官方文档:https://nodejs.orgNode.js中文网:http://nodejs.cn/Node.js 是什么?    1、Node.js 是一个基于chrome V8引擎的JavaScript的运行环境。    2、Node.js 使用了一个事件驱动,非阻塞I/O的模型。  

2020-10-19 17:59:31 14

原创 jQuery基础知识(二)

jQuery中的元素操作element.append(‘内容’); 把内容放入匹配元素内部最后面,类似原生appendChild(父元素调用)   参数:子元素   参数类型:jQuery对象、原生对象、html标签字符串element.appendTo(‘内容’); 子元素调用,参数是父元素element.prepend(‘内容’); 把内容放入匹配元素内部最前面element.prependTo(‘内容’); 子元素调用,参数是父元素eleme

2020-10-05 15:19:11 27

原创 jQuery基础知识(一)

JavaScript 库是一个封装好的特定的集合(方法和函数)。比如动画animate、hide、show、获取元素等简单理解:是一个js文件,里面对原生js代码进行封装,存放到里面。我们使用时只需调用即可。jQuery的概念1.快速、简洁的JavaScript库。2.封装了JavaScript常用的功能代码,优化了DOM操作、事件处理、动画设计和Ajax交互,以及深复制、浅复制。3.学习jQuery的本质:就是学习调用这些函数和方法。jQuery的入口函数$(function(){

2020-10-05 13:56:21 28

原创 静态服务器的优化

静态服务器的优化// 引入http模块var http = require(“http”);var fs = require(“fs”);var url = require(“url”);var MimeType = {“css”: “text/css”,“html”: “text/html”,“jpg”: “image/jpeg”,“png”: “image/png”,“js” : “application/x-javascript”}var server = http.creat

2020-09-30 08:57:28 22

原创 Node.js模块化开发

Node.js模块化开发指的是再开发过程中将各个部分单独开发,开发完毕之后进行组装。模块化开发有几种规范:1.Node.js规定一个Javascript文件就是一个模块,模块内部定义的变量和函数默认情况下在外部无法得到。2.模块内部可以使用exports对象进行成员导出,使用require方法导入其他模块AMD、 CMD、 CommonJS、 ES module transportAMD:前端模块化开发规范 代表:require.jsCMD:前端模块化开发规范 代表:sea.jsCo

2020-09-29 16:11:54 34

原创 原生node中获取get/post请求参数的方式

原生node中怎么获取get/post请求参数1. 处理get请求参数node有自己的核心模块,在这里就用到了url模块。url.parse(); 方法可以将一个完整的URL地址,分为很多部分,常用的有:host、port、pathname、path、query。第一个参数是地址,第二个参数默认是false,设置为ture后,其query属性就会从查询字符串格式(“a=1&b=2”)转换为了对象格式({a: 1,b: 2})。var urlObj = url.parse(req.url

2020-09-29 15:59:19 66

原创 数组基础知识及方法

数组是JS中的引用类型之一引用类型和值的类型的区别:存放的位置引用类型存放在内存里,堆内存值类型存放在内存里,栈内存注:通常情况下,我们只在数组下存放同一类型的成员数组的定义字面量、直接量:var arr = [ ];构造函数:var arr1 = new Array( );构造函数:var arr2 = Array( );区别字面量可以在定义数组的时候直接定义成员,构造函数也可以在定义的时候有直接定义成员。构造函数的特俗情况:当只有一个参数并且参数是数字的时候,该数字表示的是数组

2020-09-27 10:21:59 13

原创 for...of方法

for…of创建一个循环来迭代可迭代的对象。在 ES6 中引入的 for…of 循环,以替代 for…in 和 forEach() ,并支持新的迭代协议。for…of 允许遍历 Arrays(数组), Strings(字符串), Maps(映射), Sets(集合),Arguments,Generator 等可迭代的数据结构等。遍历数组var arr = [ { name:'nick', age:18 }, { name:'freddy', age:24 }, { name:'mike',

2020-09-24 16:11:59 13

原创 Se、Map、 Proxy、Symbo基础l知识

Se、Map、 Proxy、Symbol总结Set是ES6中新增的一个数据结构。可以理解为一个内容不可重复的数组 + 初始化常用方法和属性add(item) 用于向set对象内添加一项item 被添加的项注: 如果添加的是已经存在的内容 则添加失败var set = new Set([0, 1, 2, 3, {}]);set.add(6); // 添加成功set.add(-0); // 添加失败delete(item) 用于删除一项被删除的项注: 如果是引用类型 则必须地址一致才会

2020-09-24 16:08:41 25

原创 JS闭包笔记

闭包是一种特性,由作用域和垃圾回收机制共同作用而出现的一种特性。是指有权访问另一个函数作用域中的变量的函数。建闭包的常见方式:就是在一个函数内部创建另一个函数。本质上,闭包是将函数内部和函数外部连接起来的桥梁。闭包的特点:作用域空间不销毁优点:因为不销毁,变量也不会销毁,增加了变量的生命周期缺点:因为不销毁,会一直占用内存,多了以后就会导致内存溢出可以利用闭包访问在一个函数外部访问函数内部的变量优点:可以再函数外部访问内部数据缺点:必须要时刻保持引用,导致函数执行栈不被销毁保护私有

2020-09-24 15:59:48 15

原创 JS继承

寄生式继承<script> // 构造函数执行的四步: // 1 开辟一个新的空间 // 2 与函数中的this绑定 // 3 执行函数的代码 // 4 返回this // 寄生式继承 function People(name, age, sex) { this.name = name; this.age = age;

2020-09-24 15:52:16 11

原创 JS设计模式

JS设计模式节流模式节流模式的核心思想是创建定时器,延迟程序的执行。委托模式给事件发生的上一层最近的父元素绑定事件 ,用e.target去寻找事件触发的具体对象 进行实现事件。<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>事件委托</title> <style type="text/css"> *

2020-09-24 15:49:27 23

原创 promise

Promise 是异步编程的一种解决方案,其实是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上有then、catch等方法。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled/resolved(已成功)和rejected(已失败)。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。注意:我只是new了一个对象,并没有调用它,我们传进去的函数就已经执行了,这是

2020-09-21 14:30:57 31

原创 淘宝放大镜

淘宝放大镜<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * {

2020-09-17 17:15:27 8

原创 留言板ES6

留言板<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>留言板</title> <style> *{ padd

2020-09-17 16:03:35 12

原创 判定一个数字是否是质数

判定一个数字是否是质数<!DOCTYPE HTML5> <html> <head> <title></title> </head> <body> <script type="text/javascript"> // 定义一个函数 传递一个数字 返回一个布尔值 判定该数字是否是质数 function isZ(num) { // 定义一个布尔值 var bool = t

2020-09-17 15:57:05 10

原创 裁剪布局

裁剪布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * {

2020-09-17 09:29:50 26

原创 JS轮播图

JS轮播图html+css代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>

2020-09-17 09:26:07 20

原创 面向对象轮播图

面向对象轮播图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * {

2020-09-17 09:22:16 15

原创 封装运动函数最终版

封装运动函数最终版<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> * {

2020-09-17 09:08:52 13

原创 AJAX知识整理

AJAXAsynchronous Javascript And XML ( 异步的JS和XML )XML可拓展标记语言用于前后端传递数据、用于后端的配置文件;现在因为前后端之间传递数据用的都是JSON,所以基本不怎么用XML来传递数据AJAX异步发送一个HTTP请求,去后端获取数据,带回给前端浏览器,让浏览器处理。AJAX不是一门技术,是一整套技术体系包含HTML、CSS、DOM、BOM、JSON等onreadystatechange事件当请求被发送到服务器时,我们需要执行一些基于响应的任务。

2020-09-16 14:41:46 17

原创 ES6知识大全笔记

ES6中的let、const关键字letlet关键字就是用来声明变量的,使用let关键字声明的变量具有块级作用域,在一个大括号中使用let关键字声明的变量才具有块级作用域let定义的变量不能重名let a=11;var a=10;console. log(a); //会报错使用let关键字声明的变量没有变量提升console.log(a) ;// a is not definedlet a =20;使用let关键声明的变量具有暂时性死区特性var tmp = 12

2020-09-02 21:19:29 70

原创 ES5新增的数组方法

ES5新增数组方法forEach()方法两个参数:第一个参数是:回调函数第二个参数是:控制当前this指向谁第一个参数(回调函数):function(value, index, arr){};回调函数内的三个参数分别为:第一个:当前循环的值第二个:当前循环的索引第三个:当前数组本身 var demo = [ {nane: "aa", age: 26, sex:'男', score: 99}, {nane: "bb", age: 30, sex:'男',

2020-09-01 16:51:24 38

空空如也

空空如也

空空如也

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

TA关注的人 TA的粉丝

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