自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 解决 npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.问题

解决 npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.问题

2022-07-14 17:49:53 973 1

原创 git add、git commit和git push之间的区别

首先要知道暂存区 ,本地仓库和远程仓库暂存区:每一次进行代码修改的地方本地仓库:为远程仓库的一个副本远程仓库:存放到服务器上的代码git add将自己的修改提交到缓存中git commit将缓存修改过的文件提交到本地仓库中git push将本地仓库的修改提交到远程仓库上...

2022-03-22 18:55:03 1408

原创 用git连接远程仓库步骤

1.首先创建一个文件夹2.下载git工具 在空白处点击右键 打开Git Bash Here3.输入git init 进行初始化初始化完成后会显示 .git这个文件 ,如果没显示的话,打开隐藏的项目就会出现4.配置用户名及邮箱$ git config --global user.name "Your Name"$ git config --global user.email "email@example.com"5. 新创建的文件或修改的文件需要先 add 添加到仓库,再commit

2022-03-22 18:40:12 2040

原创 vue3.0 setup 用法 (详解)

vue3新语法糖——setupsetup函数是 Composition API(组合API)的入口在setup函数中定义的变量和方法最后都是需要 return 出去的不然无法在模板中使用setup函数的注意点:1、由于在执行 setup函数的时候,还没有执行 Created 生命周期方法,所以在 setup 函数中,无法使用 data 和 methods 的变量和方法2、由于我们不能在 setup函数中使用 data 和 methods,所以 Vue 为了避免我们错误的使用,直接将 setup

2021-11-25 17:16:40 4124

原创 vue3.0生命周期函数

Vue3.0 的一大特性函数 ---- setup在vue2.x中的生命周期为beforeCreate createdbeforeMount mountedbeforeUpdate updatedbeforeDestroy destroyed

2021-11-25 14:36:39 28236

原创 vscode搭建vue3.0开发环境

一.node 安装1.检测node 的安装node -v2.检测npmnpm -v3.淘宝镜像npm i -g cnpm --registry=https://registry.npm.taobao.org4.检测cnpmcnpm -v二.安装vue-cli环境支出cnpm install -g @vue/cli 安装最新的版本安装完之后检测vue -V只要不报错 不是内部命令即可三.vue 3.0创建项目vue create 项目四.启动项目cnpm r

2021-11-25 12:13:09 4150 1

原创 koa框架使用ejs模板引擎

koa框架中使用ejs1.安装koa和koa-views npm install --save-dev koa koa-views / cnpm install --save-dev koa koa-views2.安装ejs npm install ejs --save / cnpm install ejs --save3.引入koa-views配置中间件const views = require('koa-views');app.use(views('views', { map:

2021-08-16 22:29:43 516

原创 koa框架---路由总结

koa-router1.安装路由npm install --save-dev koa-router2.app.js文件require(“koa-router”) 返回的是函数const koa=require("koa");const app=new koa();//require("koa-router") 返回的是函数 执行之后返回对象const router=require("koa-router")();let port = 8080;let host = 'localh

2021-08-16 20:10:07 416

原创 koa框架搭建简单的服务器

1.配置文件package.jsonnpm init --yes2.安装koanpm install --save-dev koa 3.创建app.js//1.引入koaconst Koa = require('koa');//2.创建koa对象const app = new Koa();//建立基本变量let port=8000;let host='localhost'//对于所有的http请求 都会执行下面的异步处理函数//ctx是koa框架封装的一个对象 有respons

2021-08-14 22:50:19 882

原创 node封装方法连接MySQL数据库步骤

1.安装MySQLcnpm install --save-dev mysql2.创建服务器 app.js文件const express=require("express");//引入ejs模板const ejs=require("ejs");let app=express();let port=8000;let host='localhost'//设html后缀app.set('views','./view');//设置html模板渲染引擎app.engine('html',ejs

2021-08-09 20:24:32 389

原创 express中间件multer的使用

multer 文件上传1.安装npm install --save-dev multer 2.引入multer模块const express = require('express')//引入multer模块const multer = require('multer')3.使用//文件上传const multer = require('multer');let storage = multer.diskStorage({ //设置文件存储目录 destinatio

2021-08-08 21:48:51 1053

原创 express中间件cookie-parser的使用

cookie-parser一.cookie未加密1.安装cookie-parser中间件npm install --save-dev cookie-parser2.引入cookie-parser//express框架const express=require("express");//引入一个框架实例const app=express();//引入cookie-parserconst cookieParser=require("cookie-parser");app.use(cook

2021-08-08 21:15:57 3215

原创 express框架设置ejs模板更改后缀为html

首先引入express框架和ejs模块。const express=require("express");//引入ejs模板const ejs=require("ejs");//创建框架的实例const app=express();修改后缀为html//设置express框架使用ejs模板引擎//修改ejs模板后缀为html app.engine(".html",ejs.__express);或者为app.engine('html', require('ejs').renderFile

2021-08-08 19:59:15 481

原创 express框架设置静态资源目录

内置中间件 use设置静态资源目录 app.use(express.static('staticfile'));设置静态资源目录的虚拟目录 app.use('/public',express.static('staticfile'));

2021-08-08 15:52:35 675

原创 express框架---快递.路由器

快递.路由器使用express.Router该类创建模块化的、可安装的路由处理程序。一个Router实例是一个完整的中间件和路由系统。commom.js是创建的一个路由router文件,内容如下:const express = require('express')const router = express.Router()router.use(function timeLog (req, res, next) { console.log('Time: ', Date.now()) ne

2021-08-07 18:42:49 301

原创 express框架---路由

路由:指应用程序的端点 (URI) 如何响应客户端请求。res 服务端响应操作的相关方法:res.download() 响应下载res.end() 响应结束res.json() json数据格式响应res.jsonp() 带jsonp响应res.redirect() 路由重定向res.render() 渲染ejs模板res.send() 响应数据res.sendStatus() 发送响应状态...

2021-08-07 18:26:22 205

原创 使用express框架创建一个简单服务器

配置服务器1.先执行命令 cnpm init–yes 生成配置文件2.cnpm install --save-dev express 安装express框架3.新建一个server.js文件server.js文件//配置服务器const express=require("express");let app=express();//创建框架实例let port = 8000;let host = 'localhost';//写入路由//注册get路由app.get('/',

2021-08-07 17:08:50 259

原创 node之EventEmitter类总结

node 异步编程,异步的i/oevents模块是内置的模块。使用的里面的evenetEmitter 类模块 主要功能是 事件的发布 和 事件的监听。通过require(“events”);来访问该模块:// 引入 events 模块const events=require("events");// 创建 emitter 对象const emitter=new events.EventEmitter();on 添加一个监听 监听事件的回调函数emit 触发事件 携带参数

2021-08-05 22:25:10 195

原创 node之Stream流详解

在要学习Stream流之前,首先要知道什么是fs 模块。1.什么是fs模块?全称为File System,fs模块是Node.js的一个核心模块,专门用来操作系统中的文件,常用的操作方式是对文件的读取和写入使用require(“fs”)载入fs模块,模块中所有方法都有同步和异步两种形式。2.Stream流所有的 Stream 对象都是 EventEmitter 的实例data - 当有数据可读时触发。end - 没有更多的数据可读时触发。error - 在接收和写入过程中发生错误时触发。f

2021-08-04 23:09:47 418

原创 使用node创建一个简单服务器

第一种创建server.js文件需要nodejs的内置模块 http —做服务端请求 或者搭建服务器使用equire 异步加载模块(nodejs的内置模块 自定义模块)/*node 使用node 创建一个本地服务器*/ const http=require('http');//创建服务//createServer() 创建服务//request(请求) response(响应)let app=http.createServer((req,res)=>{ /

2021-08-02 13:32:24 1182

原创 vue路由安全守卫 (组件内路由守卫)

组件内部的路由守卫基本形式:export default { name: "Cart", beforeRouteEnter(to, from, next) { // 进入当前组件 当前组件不存在 this不存在 //console.log(to,from); //如果想获取组件的实例 //给next 添加一个匿名函数回调 形参vm 代表当前组件 next((vm)=>{ // console.log(vm); //

2021-07-30 14:09:08 5360

原创 vue路由安全守卫的使用(全局守卫)

路由的安全守卫:在路由跳转之前或者跳转之后做一些处理。1.全局守卫beforeEach 在路由跳转之前afterEach 在路由跳转之后简单的登录退出页面 路由全局安全守卫举例主要是在router.js路由节点文件和login.vue登录文件里进行一系列的操作。index.js 配置路由// 配置的路由节点import Home from '../views/Home'import Login from '../components/login'export default[

2021-07-29 16:55:46 880

原创 vue路由的get传值详解

路由跳转传值一种为路由的动态传值,一种为路由的get传值,此篇来介绍路由的get传值。一.路由get传值配置路由不需要像动态传值一样配置值, 类似于get路径传值index.js 路由节点// 配置的路由节点import Home from '../views/Home.vue'export default[ { path: '/', name: 'Home', component: Home },]主界面 App.vue<template>

2021-07-28 21:19:01 1131

原创 vue路由的动态传值详解

路由跳转传值一种为路由的动态配置值,一种为路由的get传值,先来介绍路由的动态传值。一.路由的动态传值路径要求严格,在配置路由的时候设置动态传值1.基本配置index.js 配置路由的节点// 配置的路由节点import Home from '../views/Home.vue'import about from '../views/About'//在配置路由的时候设置动态传值 类似/:idexport default[ { path: '/', name: 'Home

2021-07-28 20:13:10 1071

原创 vue事件车通信 (非父组件传值)

首先,非父组件之间的传值有两种方法,一种是事件车通信,另一种为vuex(全局状态管理,是管理整个项目的)。这篇介绍vue事件车通信的使用。事件车通信emit 触发 on 监听变化 处理事件举例说明:1.创建一个通信桥梁js文件//引入事件车通信const event=require("events");//事件模块const eventEmit=new event.EventEmitter();//EventEmitter事件监听器module.exports=eventEmit;2.

2021-07-27 14:41:25 664

原创 vue插槽的使用

什么是插槽插槽:在子组件中用< solt >< /solt >标签提供给父组件一个占位符,父组件可以在组件内容区域中填充任何形式模板的代码,如 HTML、组件等,填充的内容会替换子组件的< slot>< /slot>标签1.默认插槽举例说明:父组件: app.vue<template> <div id="app"> 首页 <!-- 简单来说,组件的内容区域写内容为插槽 -->

2021-07-26 16:41:11 237

原创 vue 路由传参的基本方式

举例说明点击父组件的button按钮跳转到子组件中,并携带参数,便于子组件获取数据父组件:My.vue<template> <div id="my">我的组件 <button @click="goHome">跳转到首页</button> //方法goHome </div></template>父组件:My.vueexport default { name: "my", data(){ r

2021-04-14 19:41:35 133

原创 vue父子组件传值:props,$ref和$emit

一.props实现通信父组件向子组件传值,子组件的props选项能够接收来自父组件数据。props仅仅只能接收,props是单向绑定的,即只能父组件向子组件传递,不能反向。而传递的方式也分为两种:静态传值和动态传值1.静态传值示例:父组件是App.vue ,子组件是Head.vueApp.vue 父组件:<template> <div id="app"> <v-head msg='标题'></v-head> </div>

2021-04-13 12:38:02 1117

原创 vue 异步挂载

为什么要使用?在使用vue-cli构建项目,在默认情况下,执行 npm run build/yarn build会将所有的js打包成一个整体,这样情况下 单页面 第一次加载页面会耗费太多时间,导致页面长时间处于 空白情况。所以通常的写法都是 按需加载,来提高加载速度此适用于项目比较大的情况下,如果就只有几个页面的情况,建议不适用 异步加载模块的方式,加载模块异步全局挂载import { createApp, defineAsyncComponent } from 'vue'import compo

2021-04-04 15:49:06 426

原创 vue组件及组件的注册

什么是组件?它是vue.js最强大的功能之一,是可扩展的html元素,是封装可重用的代码,同时也是Vue实例,可以接受相同的选项对象(除了一些根级特有的选项) 并提供相同的生命周期钩子组件例如 页面头部、侧边、内容区,尾部,上传图片,等多个页面要用到一样的就可以做成组件,提高了代码的复用率组件注册组件的注册分为全局注册和局部注册局部注册局部注册(在哪里挂载 在哪里注册 类似局部变量)在当前组件内部使用components属性 直接声明挂载示例:<template> &

2021-04-04 15:09:22 105

原创 less的用法与函数

简单概括Less (Leaner Style Sheets 的缩写) 是一门向后兼容的 CSS 扩展语言,其属于CSS预处理语言的一种,它使用类似CSS的语法,为CSS的赋予了动态语言的特性一.用法1.变量@w:200px;@h:200px;//宽高.box{ border:2px solid red; width:@w; height: @h*(1/2);}<div class="box"></div>2.混合(Mixins)@b

2021-03-29 18:08:06 6356

原创 ES6 promise对象

一.简单说明Promise 是异步编程的一种解决方案,所谓Promise,简单来说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果从语法上说,Promise 是一个对象,从它可以获取异步操作的消息Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理特点:对象的状态不受外界影响。Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)一旦状态改变,就不会

2021-03-24 21:29:39 95

原创 ES6 Generator函数

一.简单说明Generator 函数是 ES6 的一种异步编程解决方案,执行 Generator 函数会返回一个遍历器对象,返回的遍历器对象,可以依次遍历 Generator 函数内部的每一个状态。在形式上,Generator 函数是一个普通函数,但是有两个特征:一是,function关键字与函数名之间有一个星号;二是,函数体内部使用yield表达式,定义不同的内部状态(yield在英语里的意思就是“产出”)Generator 函数是分段执行的,yield表达式是暂停执行的标记,而next方法可以

2021-03-24 14:18:37 87

原创 JavaScript的this指针

一.普通函数this //单独使用 指向全局对象 window console.log(this);//window1.方法调用形式当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用时,this被绑定到这个对象上。如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用。 let person={ name:'liming', eat:function(){ console.log(t

2021-03-22 14:29:08 410 2

原创 ES6 函数的扩展

箭头函数 function method(){ } let methods=()=>{ //无参 } let methods=a=>{//有参a } let methods=(a,b)=>{//有参a,b } let data=()=>{ //执行代码 return true; } //let data=()=>true;箭头函数的特点:保持上下文this指针一致conso

2021-03-16 18:31:23 183

原创 ES6 数组的扩展

示例:<body> <button class='btn'>按钮</button> <button class='btn'>按钮</button> <button class='btn'>按钮</button> <button class='btn'>按钮</button> <button class='btn'>按钮</button>

2021-03-16 16:07:18 89

原创 ES6 变量的解构赋值

变量解构:按照相同的结构对应给值数组的解构赋值模式匹配(只要等号两边的模式相同,左边的变量就会被赋予对应的值)let [a, b, c] = [1, 2, 3];let [ , , third] = ["wang", "zhang", "li"];third // "li"let [x, , y] = [1, 2, 3];x // 1y // 3可以从数组中提取值,按照对应位置,对变量赋值let [th] = [];let [ht, th] = [1];以上两种情况都属于.

2021-03-15 17:46:18 64

原创 ES6 let与const;let,const,var 之间的区别

let命令let基本用法let作用:ES6 新增了let命令,用来声明变量{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1在上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值,let的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。块级作用域:在ES6中凡是{}包裹的代

2021-03-15 16:11:35 166

原创 JavaScript----原型链

原型链什么是原型链?在获取对象属性时,如果对象本身没有这个属性,那就会去他的原型__proto__上去找,就一层层的扒出创建对象的构造函数,直至到Object时,就没有_proto_指向了,_proto_实质找的是prototype,所以只要找这个链条上的构造函数的prototype,Object.prototype对象属性值为null示例://内置对象的原型链var arr = [];console.log(arr);//从内置对象上可以观察到//实例化的当前对象//__proto_

2021-03-12 17:53:56 54

原创 jQuery----ajax请求

jQuery-ajax 请求$.ajax(url,[settings])$.get(url,[data],[fn],[type])$.getJSON(url,[data],[fn])$.getScript(url,[callback])$.post(url,[data],[fn],[type]) type 返回的值类型 html script text json1. get 请求//1.加载完成 $(function () { //服务器请求的api

2021-03-12 14:12:37 70

空空如也

空空如也

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

TA关注的人

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