- 博客(130)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 131.《react-router v 5 与 react-router v 6》
React Router 6 和 React Router 5 (React路由) 最详细教程
2023-02-12 22:11:39
497
原创 129.《uniapp在移动端app使用echarts白屏问题解决方案》
在我们uniapp开发中,难免会使用到 echarts 图标，这些图表在我们浏览器端编译没有任何问题，但是一旦编译到手机端app就会出现白屏问题，报错是没有。属性在移动端失效，无法在移动端拖拽，在sersor中使用渐变色 new echarts无法生效，报错。显而易见，手机端是没有dom节点的，为了解决这个问题，提供了两种解决方案，各有优劣。正因为使用原生方法，所以导致使用起来麻烦点，没有方案一中那样，直接配置就行。1.因为使用了 原生的方法，所以兼容性相对方案一来说相对好点，其中的。
2022-09-11 16:09:13
1773
原创 128.《usestate与useRef 区别及应用场景》
这篇博客主要是 `useState` 与 `useRef`的区别，以及实际使用场景，博客代码仅会涉及功能组件，需要的朋友麻烦点点赞
2022-08-14 21:39:52
3651
2
原创 127.《消息订阅与发布的原理》
消息发布与订阅是一种组件通讯，在 vue 和 react 中 能够简化组件通讯，能够像组件订阅消息和接收消息首先得明白事件的三大准则：，，事件源就是事件源头，也就是事件发布者，一般用 关键字代替；事件状态，或者是这个事件是否有效，一般通过 来甄别这个事件是否有效；最后就是事件的接收者，用 关键字再了解三大准则的基础上，还得知道一个名词 事件池，在一个正真的企业级项目里面，会多次使用消息订阅与发布，多次消息的订阅 则称为 事件池（多个事件的集合）下面，我们通过 用户的订阅与取消来模拟我们的订阅与发布微
2022-06-04 13:01:31
448
原创 126.《js 手撕 new》
手撕 new文章目录手撕 new1.new过程发生了什么？1.创建空对象2.将空对象原型指向构造函数的原型3.将空对象作为构造函数的上下文4.对构造函数的返回值做了特殊处理2.如何实现 new 操作符？模拟实现new 的作用就是通过构造函数来创造一个实例1.new过程发生了什么？创建了一个空对象将空对象的原型指向构造函数的原型将空对象的原型作为构造函数的执行上下文对构造函数的返回值做了特殊处理返回值若为 基本数据类型 则直接过滤，直接忽略返回值若为 对象 则直接返回究竟是否
2022-05-29 23:21:31
145
原创 125.《React Hook 代码+案例》
react hook总结文章目录react hook总结0.概念纯函数1、useState 保存组件状态2.useEffect 生命周期3.createContext4.useReducer5.useMeua6.useCallBack7.自定义 hookHook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。0.概念纯函数前言：什么是纯函数？纯函数需要满足一下两个条件：函数没有副作用相同的输入有相同的输出什
2022-05-06 16:31:21
687
原创 124.《sql，json编辑器之CodeMirror》
文章目录CodeMirror使用说明书001.视频展示002.图文展示003.gitee地址demo地址sql编辑器所用到的npm包codemirror 使用步骤1.codemirror 引入核心库2.页面容器3.按需引入包文件4.根据设置的主题，引入相应的主题包,主题包存储在theme下，使用其他主题包时设置配置项中theme为对应主题5.根据设置的编辑器语言，引入相应工具包,以下为常用语言包6. 将容器转换为编辑器7.初始化可设置的值8.事件触发器9.APICodeMirror使用说明书001.视频
2022-04-03 21:57:59
3074
原创 123.《js实现实现深浅拷贝---代码文字详解》
js实现实现深浅拷贝1.概念；浅拷贝：当对对象进行赋值操作时，赋值后的新对象，如果改变其中第一层级的值，那么 赋值后的 新对象 相应的值也 会 随之改变，这就是对象的浅层次的拷贝，也称为 浅拷贝深拷贝：当对对象进行赋值操作时，赋值后的新对象，如果改变其中第二层级或二层级后的其他层级的值，那么 赋值后的 新对象 相应的值也 不会 随之改变，这就是对象的深层次的拷贝，也称为 深拷贝案例如下：let obj = { a: 100, b: 200}let newObj = objobj.a =
2022-02-20 22:08:31
848
原创 122.《react-redux + redux 结合使用详解及案例》
react-redux + redux 详细总结文章目录react-redux + redux 详细总结1.理解2.react-Redux 将所有组件分成两大类3.相关 API4.案例 + 效果图1.理解一个react插件库专门用来简化react应用中使用redux2.react-Redux 将所有组件分成两大类UI组件只负责 UI 的呈现，不带有任何业务逻辑通过props接收数据(一般数据和函数)不使用任何 Redux 的 API一般保存在components文件夹下
2022-02-06 19:06:59
188
原创 121.《redux 详细总结+效果图+案例》
redux 详细总结文章目录redux 详细总结1.redux1.1学.习文档1.2. redux 是什么1.3.什么情况下需要使用redux1.4. redux 工作流程2. redux 的三个核心概念2.1. action2.2. reducer2.3. store**此对象的功能?**3. redux 的核心 API3.1. createstore()3.2 store对象3.3. applyMiddleware()3 .4. combineReducers()4.案例1.redux1.1学
2022-02-06 18:44:10
197
原创 120.《vue3.0 最全详细总结+案例》
文章目录一、创建Vue3.0工程1.使用 vue-cli 创建2.使用 vite 创建二.常用 Composition API1.ref函数2.reactive函数3.vue2.0响应式原理4.vue3的响应式原理5.reactive 和 ref 区别6. setup的注意点7.计算属性与监听器1.computed2.watch3.watchEffect函数8.vue3 生命周期9.自定义hook函数10.toRef 和 toRefs1.toRef2.toRefs三.其它 Composition API01
2021-12-26 19:07:14
13696
6
原创 119.《插槽,mixin,全局事件总线》
1.插槽1.默认插槽封装插槽的组件 <ul> <li>{{ title }}</li> <slot></slot> </ul>插槽的实施方 <Com title="游戏"> <ul> <li>张三</li> <li>李四</li> <li>
2021-12-05 19:37:57
529
原创 118.《TypeScript 基础知识总结(数据类型,接口,抽象类,继承,属性封装,修饰符) 》
文章目录typescript知识点总结1.概念2.typeScript 中的数据类型数字字符串布尔值undfindnullobj元组枚举函数类型3. 运算符| 或& 并且类型的别名类型的断言4. 类的继承5.super 关键字6. 抽象类7. interface 接口8. 属性的封装方式一：方式二：typescript知识点总结1.概念类（class）: 定义了一类事物的特点，这类事物具有属性和方法对象（Object）: 定义的类被 new 实例化 生成我们的对象面向
2021-11-20 16:05:17
854
原创 117.《React - Hoke 总结》
Hook总结1.useState使用 useState 实现计数器加减import React,{ useState } from 'react'function addCount(){ let [ count,setCount ] = useState(0) const Add = ()=>{ setCount(count + 1) } return ( <> <Button onClick={ Add } > + 1 </Butt
2021-11-16 21:04:48
3519
原创 116.《React基础知识总结大全》
文章目录react 基础知识总结01.阻止默认行为02.组件传值1.父向子2.子向父3.兄弟组件传值03.规则校验**1.安装**2.引入3.使用04.生命周期1.挂在阶段2.更新阶段3.卸载阶段05.componentDidUpdate 中 setState 报错06.高阶组件**1.ender props 模式**2.高阶组件(封装)07.路由08.createContext() 传值react 基础知识总结01.阻止默认行为export default class Index extends
2021-10-29 00:33:15
127
原创 115.《table组件的二次封装》
table组件二次封装使用1.组件封装2.全局注册3.全局使用4.页面使用1.组件封装<template> <div> <el-table ref="multipleTable" v-loading="loading" :data="tableData" border fit :row-key="getRowkeys" @row-click="handleRowClick"
2021-10-24 17:35:31
375
1
原创 114.《element中form组件的二次封装》
form组件form组件组件封装功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入form组件你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了
2021-10-24 17:29:25
421
转载 113.《Moment.js常见用法总结》
Moment.js常见用法总结- Moment.js是一个轻量级的JavaScript时间库，它方便了日常开发中对时间的操作，提高了开发效率。Moment详细使用
2021-09-05 23:34:25
78
原创 112.《VUE table表格导出Excel（自定义表头+自定义导出字段内容》
title:VUE table表格导出Excel（自定义表头+自定义导出字段内容）文章目录title:VUE table表格导出Excel（自定义表头+自定义导出字段内容）1.安装项目依赖2.下载项目所需文件 Blob.js、export2Excel.js3.组件中导出按钮定义事件4.事件所对应的方法5.js方法1.安装项目依赖npm install --save xlsx file-savernpm install -D script-loader2.下载项目所需文件 Blob.js、e
2021-08-10 11:48:50
830
原创 111.《 解决 vs code 上禁止运行脚本。有关详细信息，请参阅 报错》
解决 vs code 上禁止运行脚本。有关详细信息，请参阅 报错输入cnpm i element-ui -S报错解决方法：1.在win10 系统中搜索框 输入 Windows PowerShell，选择 管理员身份运行2.使用，win+R打开了powershell命令行之后,输入set-ExecutionPolicy RemoteSigned，然后更改权限为A，最后通过 get-ExecutionPolicy 查看当前的状态...
2021-08-02 17:48:13
215
原创 110.《js的事件循环与setImmediate,process.nextTick》
js是单线程？为什么是单线程，首先就要理解什么是单线程，单顾名思义就是同一时间完成同一件事，其实生活中也很多这样的例子，比如你做菜，肯定是提前把 材米油盐以及配菜准备好，才可以进行下面炒菜的环节，也就是在保证顺序的情况下，在某个特定的时间内专心做件事，备菜时间就备菜，切菜时间就切菜，这就是我们生活中的一个例子那么js为什么是单线程的？其实js作为脚本语言，跟他的用途相关的，因为js面向的是浏览器，是不停的在我们DOM树上进行节点的操作，如果js开启了两个线程，第一个线程是在DOM树上添加节点，宁外一个
2021-08-01 22:35:40
274
原创 109.《hooks中useReducer的使用(计数器案例)》
import React, { Component, useState,useReducer,useEffect } from 'react' function App(){ let useReducerData= (state,action)=>{ switch(action){ case "add": return state + 1 case "sub": r
2021-07-30 22:08:49
87
原创 108.《Redux的详细使用(案例)》
Redux是一个用来管理管理数据状态和UI状态的JavaScript应用工具。随着JavaScript单页应用（SPA）开发日趋复杂，JavaScript需要管理比任何时候都要多的state（状态），Redux就是降低管理难度的。（Redux支持React，Angular、jQuery甚至纯JavaScript）按照下面的项目结构，创建项目，并把代码复制进去，就可以呈现出利用Redux管理数据的react案例案例图片当我们在文本框输入内容，点击确定就会进行追加项目结构图解所需安装的依赖cn
2021-07-24 23:20:47
227
5
转载 108.《Echarts总结》
echarts终极总结配套视频:https://www.bilibili.com/video/BV1v7411R7mp?p=11.echarts介绍d常见的数据可视化库：- D3.js 目前 Web 端评价最高的 Javascript 可视化工具库(入手难) - ECharts.js 百度出品的一个开源 Javascript 数据可视化库 - Highcharts.js 国外的前端数据可视化库，非商用免费，被许多国外大公司所使用 - AntV 蚂蚁金服全新一代数据可视化解决
2021-07-16 18:18:08
173
原创 107.《vue搭建项目的步骤》
搭建vue脚手架的步骤创建脚手架一路回车vue init webpack testpro安装依赖npm install axios element-ui less less-loader --save创建目录结构reset.css/*清除页面元素默认样式*/*{ padding: 0; margin: 0;}/* body,p,h1,h2,h3,h4,h5,h6,ol,ul,dl{ margin: 0;}ol,ul,dd{ padding: 0;} */
2021-07-16 18:11:47
102
1
原创 106.《React 数据请求的封装》
React 数据请求的封装安装npm install axios --savehttp 封装文件import axios from 'axios' // 请求拦截器axios.interceptors.request.use(function (req) { // 添加自定义请求头 const userInfo = sessionStorage.getItem('userinfo') || '{}' // // 将登录凭证通过自定义请求头发送给数据接口
2021-07-16 15:04:52
261
3
原创 105.《React中prop-types数据校验》
数据校验什么是prop-types？prop代表父组件传递过来的值，types代表类型。简单来说就是用来校验父组件传递过来值的类型安装第三方依赖cnpm i prop-types --saveindex.jsimport React from 'react';import ReactDOM from 'react-dom';// 导入校验包import propTypes from "prop-types";class Parent extends React.Component{
2021-07-07 21:27:06
119
原创 104.《React中Context的使用》
Context跨越组件传值import React from 'react'; const { Provider,Consumer } = React.createContext() // 祖父 组件 向 孙组件 传值class Pars extends React.Component { state = { num:0 } render() { return ( <Provider value={this.
2021-07-07 19:02:15
68
原创 103.《React,组件传值的三种方式》
父向子传值Par (父组件)import React from 'react';class Parent extends React.Component{ state = { num:0 } render(){ return ( <div> <Child num={this.state.num} /> </div> ) }}Child （子组件）class Child extends React.Compoent{
2021-07-07 18:43:48
114
原创 102.《uni-app 请求接口的封装》
uni-app 请求接口的封装request.jsconst Url = '127.0.0.1:8080'export const request = (params)=>{ return new Promise((resolve,reject)=>{ wx.showLoading({ title: '加载中' }) uni.request({ url: Url + params.url,
2021-06-27 23:25:25
71
2
原创 101.《jquery详细总结》
JQuery总结前言/* jquery优点1、轻量级2、强大的选择器3、出色的DOM操作的封装4、可靠的事件处理机制5、完善的ajax6、不污染顶级变量7、出色的浏览器兼容8、链式操作方式9、隐式迭代10、行为层和结构层的分离11、丰富的插件支持12、完善的文档13、开源jquery库的类型氛围两种jquery.js (未压缩版) 开发版本jquery.min.js (压缩版) 生产版本：经过工具压缩之后的版本 */1.JQuery与原生js对象相互转换
2021-06-17 22:43:13
136
1
原创 100.《js数组的方法》
js数组的方法push()数组的栈方法（先进后出 后进先出, 返回数组的长度let arr = [1,2,3]let arr1 = arr.push(4) console.log(arr1) // 4pop()数组的栈方法 删除数组末尾的一个元素 返回被删除的元素let arr = [1,2,3]let res = arr.pop()console.log(res) // 3shift数组的队列的方法 删除数组第一个元素 并且返回被删除的数组元素（先进先出，后进后出），
2021-06-14 20:54:59
60
原创 99.《js 字符串方法 时间对象 案例 》
一.js 字符串方法1.字符串方法 length 字符串的长度let str = 'abcdefg'console.log(str.length) // 7charAt(下标) 字符串中下标所对应的字符let str = 'abndsmfkds'console.log(str.chartAt(1)) // b charCodeAt() 字符串对应下表的字符编码let str = 'abcdrfg'console.log(str.chartAt(0)) // 97inde
2021-06-13 20:49:54
71
原创 98.《js计算未来某个时间到现在时间的 倒计时》
// 倒计时 function auto() { //1.获取当前时间 var currentDate = new Date(); console.log(currentDate, '当前时间') //2.目标时间 var targetDate = new Date(2022, 12, 12, 0, 0, 0); console.log(targ.
2021-06-13 14:54:31
367
翻译 97.《网络协议(HTTP,HTTPS,UDP,TCP)及网络分层原理》
网络分层有两种不同的分层方式，分别为 ISO 分层和 UDP 分层1.OSI七层协议模型什么是ISO？ISO是“国际标准化组织”的英文简称，其全称是International Organization for Standardization。ISO成立于1947年2月23日，是世界上最大的国际化标准组织。OSI七层协议模型主要是：应用层（Application）、表示层（Presentation）、会话层（Session）、传输层（Transport）、网络层（Network）、数据链路层（Da.
2021-05-27 21:35:03
269
原创 95.《ajax请求超时与网络异常》
html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>请求超时与网络异常</title> <style> #result{
2021-05-27 18:19:48
67
原创 94.《ajax案例详解(node+ajax)》
ajaxajax的优点可以无需刷新页面而与服务器端进行通信。允许你根据用户事件来更新部分页面内容。AJAX 的缺点没有浏览历史，不能回退存在跨域问题(同源)SEO 不友好http 超文本传输协议http是浏览器与万维网服务器之间互相通信的规则请求报文请求行 get / url / http/1.1头 Host:www.liuua.com Cookie: name = gunian content-type: applicat
2021-05-27 16:35:15
177
原创 93.＜报错 SyntaxError: Unexpected token R in JSON at position 0 at JSON.parse (＜anonymous＞)的解决方法＞
@[TOC]( 报错 SyntaxError: Unexpected token R in JSON at position 0 at JSON.parse ()的解决方法)报错代码：const { Acticle } = require("../../model/article")module.exports = async (req,res)=>{ // 判断是文章管理页面还是用户管理页面 req.app.locals.currentLink = "article";
2021-05-23 13:31:56
337
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人