自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

MyBlog

https://tao-yuhan.gitee.io/tyhanblog/

  • 博客(113)
  • 资源 (8)
  • 问答 (1)
  • 收藏
  • 关注

原创 nuxt2中使用dart-sass

nuxt2中使用dart-sass

2022-11-21 22:32:23 754

原创 Vue精美简洁登录页

Vue精美简洁登录页,开箱即用

2022-06-30 14:33:48 16206 2

原创 Vue项目中配置eslint

vue项目中配置eslint

2022-06-28 22:21:51 1641

原创 js实现图片懒加载的一个详细方案(引入即可使用)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>懒加载</title> <style> img { width: 600px; height: 450px; } </style> <script src="./lazyLoad.js"></scr

2022-05-28 22:30:07 432

原创 JavaScript类数组与Array.form()

认识类数组有下标和lengthconst obj = { 0: 1, 1: 3, length: 2,}const arr = Array.from(obj)console.log(arr) // [1, 3]相关问题假设给obj一个push方法,并且push一个数会产生什么效果?const obj = { 0: 1, 2: 3, length: 2, push: [].push}obj.push(4)console.log(obj) // { 0:

2022-05-11 22:09:09 420

原创 vue2生命周期

<div id="app"> <div class="demo">{{ msg }}</div></div><script> new Vue({ el: '#app', data: { msg: 'ok' }, methods: { show() { console.log('show') } }, // 此时只有Events和生命周.

2022-04-30 14:02:36 316

原创 Vue2响应式原理浅析

definePropertyObject.defineProperty() 方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。下面做一个简单的示例: const data = {} let name = '123' Object.defineProperty(data, 'name', { get: function() { return name }, set: function(newValue) { console.log('set')

2022-04-30 14:00:11 206

原创 采用Vue+Node前后端分离的校友信息管理系统(适合毕业设计)

本系统所采用的技术:前端:vue2后端:koa2数据库:mongodb整个系统分为:新闻模块、校友会模块、校友活动模块、招聘信息模块、捐赠模块、个人信息管理模块。以下为相关页面:

2022-04-27 23:11:51 1200

原创 JavaScript中的数据拷贝

数据类型及拷贝方式JavaScript的数据类型分为基本类型和引用类型:基本类型有:numberstringbooleannullundefinedsymbol引用类型有:objectfunctionarray基本数据类型在拷贝的时候会产生新的副本,原值是不会改变的。引用数据类型在普通的赋值拷贝时,拷贝的是引用的地址。let arr = [1, 2, 3]let arr2 = arrarr2[0] = 0console.log(arr) // [0, 2, 3]正

2022-04-27 22:28:49 2095 1

原创 JavaScript原型、原型链、继承

原型prototype与__proto__先简单理解以下几句话:每一个对象都有一个__proto__属性,并且指向它的prototype原型对象每一个构造函数都会有一个prototype原型对象,prototype原型对象里的constructor指向构造函数本身直接看下面代码:function Person(name, age, sex) { this.name = name this.age = age this.sex = sex}// 先打印看看Person是什么// 打印

2022-04-27 22:26:50 1682

原创 JS中的this指向

以下为一个面试题:var obj = { foo: function() { console.log(this) }}var bar = obj.fooobj.foo() // objbar() // windowJavaScript中全局存在一个window对象,所有定义的函数或者变量都会挂载到window对象中,比如:var obj = 1//相当于window对象身上多了一个obj属性window: { obj: 1}所以bar()也可以写成window.

2022-04-27 22:03:50 1436

原创 原生JS+防抖,模拟滚动加载数据

思路:滚动条头部距离顶部的距离加上,滚动套自身的高度等于整个页面的高度滚动条高度(即可视窗口的高度)let clientHeight = document.documentElement.clientHeight滚动条头部距离顶部的高度let scrollTop = document.documentElement.scrollTop整个页面的高度(包括溢出看不见的高度)let scrollHeight = document.documentElement.scrollHeight.

2022-01-05 14:30:11 677

原创 原生js实现图片懒加载

<img data-src="https://pic.imgdb.cn/item/614ed1642ab3f51d91a0da60.jpg" ><img data-src="https://pic.imgdb.cn/item/6184d50c2ab3f51d910e3c4f.jpg" ><img data-src="https://pic.imgdb.cn/item/6184d41a2ab3f51d910cee6f.jpg" ><img data-src="h

2021-12-20 18:00:51 2208

原创 React学习宝典

文章目录1. 第一个React页面2. JSX语法规则3. 组件类别3.1 函数式组件3.2 类式组件4. 状态State4.1 详细版4.2 简写版5. props5.1 基本使用5.2 传递限制5.3 简写方式6. ref使用方式7. 非受控组件8. 受控组件9. 高阶函数的使用9.1 高阶函数9.2 函数的柯里化10. 生命周期10.1 旧的生命周期图10.2 新的生命周期10.3 getSnapshotBeforeUpdate的使用场景11. Diff算法12. 配置代理解决跨域13. 组件之间的通

2021-12-20 11:53:09 520

原创 Component inside <Transition> renders non-element root node that cannot be animated.

在Vue3中使用<keep-alive></keep-alive>做页面缓存后,检查每个页面是否有根标签,在Vue3中可以不写跟标签,但做缓存的时候要加上。 <router-view v-slot="{ Component }"> <transition> <keep-alive> <div> <component :is="Component" /> <

2021-12-13 17:45:36 2278

原创 leetcode初级算法篇——数组(一)

1.删除排序数组中的重复项给你一个有序数组 nums ,请你 原地 删除重复出现的元素,使每个元素 只出现一次 ,返回删除后数组的新长度。判断当前位于后一位是否相等,相等则删除当前位,数组下标-1,从前一位开始再进行比较/** * @param {number[]} nums * @return {number} */var removeDuplicates = function(nums) { for(let i = 0; i < nums.length; i ++) {

2021-11-25 15:36:32 269

原创 vue项目开发总结——任务悬赏平台(前端)

项目简介:该项目实习中的第一个项目,该项目分为用户端、企业端、后台管理端。用户可以在任务大厅接受任务,每完成任务都会获得响应的报酬,用户只能接受一个任务,该任务完成后才能继续下一个任务。任务进行期间,该任务可以被企业取消,若企业取消用户正在完成的任务,则返回5%的奖励给用户。企业可以发布任务,发布任务之前需要上传企业认证凭证给后台管理端,后台管理员审核通过之后企业才可发布任务,企业可以对用户已完成的任务进行确认完成任务和打回重做。一、相关技术vue2scssaxioscookieelem.

2021-11-22 10:56:38 877

原创 koa2配置跨域

npm i koa2-cors --save在app.js中引用const cors = require('koa2-cors')一定要在路由之前使用中间件app.use(cors())

2021-09-21 17:08:57 404

原创 node.js常用模块

目录1.path模块1.1 normalize1.2 join1.3 resolve1.4 extname1.5 basename1.6 dirname1.7 parse1.8 format2.fs模块2.1 readFile2.2 writeFile3.buffer4.events5.http模块5.1 get请求5.2 post请求1.path模块const path = require('path')1.1 normalize将字符串处理成路径const nor = path.normal

2021-09-20 16:51:17 751

原创 Vue中解决https,请求http及跨域问题

在vue.config.js中配置代理服务器module.exports = { devServer: { proxy: { ["/dev-api"]: { target: 'api',//api是后端接口地址 changeOrigin: true, ws: true, pathRewrite: { "^/dev-ap": '' } } } }}设置ax

2021-09-18 11:24:35 11375 1

原创 Vue + Element +Echarts 搭建后台管理系统

效果展示 ## 涉及要点请求接口使用axios,在main.js全局配置,并使用拦截器,引入Nprogress时间加载进度条的效果// 配置axios请求路径axios.defaults.baseURL = ''axios.interceptors.request.use(config => { Nprogress.start() config.headers.Authorization

2021-08-27 09:02:21 890 2

原创 Vue中使用echarts报错,【TypeError: Cannot read property ‘init‘ of undefined】

将以下这行代码替换import echarts from 'echarts'替换代码import * as echarts from 'echarts'使用方式<script>import * as echarts from 'echarts'export default { data () { return {} }, mounted () { const myChart = echarts.init(document.getElementById

2021-08-26 20:15:12 319

原创 Element-UI中el-eascader显示问题

数据多的时候显示效果显示的位置和高度都出现问题只需要给menu和panel加高度就好了.el-cascader-menu { height: 300px;}.el-cascader-panel { height: 300px;}

2021-08-23 15:40:01 267

原创 JavaScript【数据结构与算法】(二) 单向链表

目录链表的优势单向链表的一些基本操作链表操作的封装链表的基本实现1.append2.insert3.get4.indexOf5.update6.removeAt7.remove8.toString完整代码实现个人博客地址:https://tao-yuhan.gitee.io/tyhanblog/链表的优势链表中的元素在内存中不必是连续的空间链表的每一个元素由一个存储元素本身的节点和一个指向下一个元素的引用链表在创建的时候不需要确定大小,大小可以无线延伸下去单向链表的一些基本操作链表得有一

2021-08-20 21:14:58 409 2

原创 vuepress-theme-reco主题相关配置 + gitee pages 部署

我的博客预览:https://tao-yuhan.gitee.io/tyhanblog/

2021-08-20 14:54:04 1282 1

原创 Java基础版贪吃蛇

0.成果展示博客地址:java贪吃蛇1.绘制静态窗口StartGames.javapackage com.tao.snake;import javax.swing.*;public class StartGames { public static void main(String[] args) { //1.绘制静态窗口 JFrame frame = new JFrame("贪吃蛇"); frame.setBounds(200,200,900,700);

2021-08-15 00:36:39 211

原创 Vue3.x基础解析【推荐学完Vue2.x的来了解一下】

目录1.认识Vue32.创建Vue3项目1.1 vue-cli创建1.2 vite创建3.初探Vue33.1 采用TS后入口文件为main.ts3.2 Vue3中html模版可以没有根元素3.3 script4.常用Composition API4.1 setup4.2 setup与ref4.3 reactive4.4 计算属性4.5 监视器4.6 生命周期4.7 自定义hook函数5.其它5.1 shallowReactive 与 shallowRef5.2 readonly 与 shallowReado

2021-08-13 22:19:36 417

原创 Vue3中响应式数据代理原理Proxy

Vue3中使用响应式数据Vue3使用响应式数据需要通过ref与reactive<template> {{ num }} <button @click="Method1">button</button></template><script lang="ts">import { defineComponent, reactive, ref } from "vue";export default defineComponent({

2021-08-13 16:20:41 695

原创 Java基础【稀疏数组】

创建一个11*11的二维数组int[][] array1 = new int[11][11];array1[1][2] = 1;array1[2][3] = 2;System.out.println("原始数组");for(int[] ints : array1) { for(int anInt : ints) { System.out.print(anInt + "\t"); } System.out.println();}打印结果转化为稀疏数组先算出值不为0的

2021-08-11 21:52:17 124

原创 【快速上手TypeScript】基础知识罗列

目录基础预览类型介绍any类型ts中的字面量联合类型unknow类型object类型array类型tuple类型enum类型类型的别名类型断言类型总结编译选项类类的基本使用继承抽象类多态静态类型接口类类型接口对象类型接口函数类型接口属性的封装函数函数的完整写法参数泛型基本泛型多个泛型接口泛型类泛型泛型约束基础预览ts可以声明一个变量的类型,此后该变量只能为该类型let a: number;a = 10;如果声明和变量同时进行,ts自动对变量进行类型声明let a = 10;对函数的参数进行

2021-08-11 17:03:30 159

原创 【Themes for IntelliJ-based IDEs】Idea主题下载

下载地址:https://plugins.jetbrains.com/search?isPaid=false&tags=Theme下载完成后直接将.jar拖入到idea中即可

2021-08-09 22:17:10 1442 1

原创 【Java基础篇】输入两个数实现加减乘除

package com.method;import java.util.Scanner;public class method02 { public static void main(String[] args) { int num1 = 0; int num2 = 0; int result = 0; int type = 0; Scanner scanner = new Scanner(System.in); if (scanner.hasNe

2021-08-09 22:05:27 4118

原创 【微信小程序】音乐播放小程序

效果展示项目总结请求数据的方式采用wx.request(),将其封装称为一个Promise对象export default (url, data={}, method = "GET") => { return new Promise((resolve, reject) => { wx.request({ url: config.host + url, data, method...

2021-08-08 20:56:15 1072

原创 【TypeScript】贪吃蛇小游戏

效果预览项目结构共有Food,GameControl,ScorePanel,Snake四个类食物类//食物类class Food { //食物所对应的元素 element: HTMLElement; constructor() { this.element = document.getElementById('food'); } //获取食物位置的方法 get X() { return this.element.offsetLeft; } ge

2021-08-03 21:51:16 235 1

原创 TypeScript学习总结

目录基础预览类型介绍any类型ts中的字面量联合类型unknow类型object类型array类型tuple类型enum类型类型的别名类型总结编译选项类类的基本使用接口属性的封装泛型基础预览ts可以声明一个变量的类型,此后该变量只能为该类型let a: number;a = 10;如果声明和变量同时进行,ts自动对变量进行类型声明let a = 10;对函数的参数进行类型限制function sum(a: number,b: number) { return a + b;}函数

2021-08-02 13:53:11 417

原创 Vue移动商城项目(首页、详情页、购物车功能、项目部署方式)

项目成果项目演示地址:(腾讯云webify) supermale-5glmkgymb6d057cd-1301795258.ap-shanghai.app.tcloudbase.com项目要点1.在使用VueRouter进行页面跳转的时候,需要合理使用Vue生命周期的两个函数,activated函数与deactivated函数2.Vue中使用better-Scroll的时候,等数据全部渲染完之后要重新调用refresh函数,重新计算内容的高度。3.在使用Vuex时,将所有的操作全部放在act

2021-07-31 23:00:08 2666

原创 ajax实现文件上传

<!-- ajax上传文件 --> <h1>ajax上传文件</h1> <form action="/imgUpload" method="post" enctype="multipart/form-data"> <input type="file" name="imgfile" id="imgInput"> <div id="sBtn">上传</div> &...

2021-07-27 12:51:06 181

原创 Express学习笔记与记录

目录Express安装Express路由1.字符串的路由模式2.类字符串的正则模式3.正则表达式路径4.动态路由5.路线处理程序ejs常用语法GET提交POST提交允许前端跨域请求中间件cookie1.安装2.引入3.设置中间层4.设置cookie5.参数说明6.查看加密的cookie7.加密原理解析8.自定义加密代码session1.安装、引入、设置2.常用配置multer中间件ajax实现文件的上传Express安装官方文档:https://www.expressjs.com.cn/starter/

2021-07-27 12:45:04 603

原创 JavaScript【数据结构与算法】(一) 栈与队列

栈栈结构,栈结构就是在数组的基础上限制一些操作栈的常用方法push(): 添加一个新元素到栈顶pop(): 移除栈顶元素,同时返回被移除的元素peek(): 返回栈顶元素,不对栈做修改isEmpty(): 栈里无元素则返回truesize(): 返回栈的元素个数toString(): 将栈结构的内容以字符形式返回栈的代码实现//f封装栈类function Stack() { //栈的属性 this.items = [] //栈的操作 /

2021-07-25 19:44:29 473 1

原创 Node.js爬取数据并存放在Mysql中

连接数据库node.js连接数据库需要先安装mysql包npm install mysql连接数据库操作const mysql = require('mysql')let options = { host: "localhost", user: "root", password: "123123", port: "3306",//可选 database: "mall"}//创建与数据库连接的对象let con = mysql.createConnection(option

2021-07-24 17:00:23 995 3

vue最新devtools,vue3的调试工具

vue最新devtools,vue3的调试工具

2022-10-27

前后端分离的校友信息管理系统(适合用来当作毕业设计)

基于vue+koa2实现的校友信息管理系统,共分为新闻模块、校友会模块、校友活动模块、招聘信息模块、捐赠模块、个人信息管理模块。数据库采用mongodb数据库,文章编辑采用富文本编辑器,支持上传图片等操作。拥有一个前台页面和一个后台管理页面,在后台管理页面中,管理员可以管理所有用户的信息,用户自己发表的新闻、活动等相关内容都需要经过后台管理员的审核,审核通过的资源可展示在前台页面。 整个系统所采用的技术难度不高,前后端交互采用axios,对于学习前端的同学来说,可以作为一次node作为后端的尝试,个人对koa的整个使用做了一次封装,整个目录结构也可以作为参考学习。对于想要当作毕业设计的同学来说,该系统也完全够用。 前后端的接口访问权限也做了jwt验证,想要学习这方面的知识可以下载学习一边。 Vue+koa+mongodb校友信息管理系统,Vue+koa+mongodb校友信息管理系统,Vue+koa+mongodb校友信息管理系统,Vue+koa+mongodb校友信息管理系统,Vue+koa+mongodb校友信息管理系统,Vue+koa+mongodb校友信息管理系统

2022-04-27

utools工具箱

utools工具箱

2022-04-25

windows-nvm

windows-nvm,新建文本中包含淘宝镜像

2022-04-23

devtools.zip

vue.js调试工具

2021-07-09

phpnow_1681.zip

phpnow_1681.zip

2021-05-22

xampp8.0.2.zip

xampp8.0.2

2021-05-22

Bootstrap项目练习.zip

第一次使用Bootstrap制作的网页

2021-05-15

hadoop-2.5.0.tar.gz

hadoop-2.5.0.tar.gz

2021-04-29

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

TA关注的人

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