- 博客(37)
- 收藏
- 关注
RSS订阅原创 uniapp报错--app.json: 在项目根目录未找到 app.json
我的小程序代码编译后的工程文件目录为：dist/dev/mp-weixin/2. 配置miniprogramRoot，指定小程序代码的根目录。1. 程序根目录打开project.config.json文件。
2024-07-07 10:05:16
1421
原创 for循环、for of、for in、forEach、map、filter、every、some、reduce遍历的用法（区别）
1、for循环最普通的遍历方法。循环条件总比循环体要多执行一次。2、for of3、for infor in 语句用于循环对象属性。虽然也可以遍历数组，但是不建议用（容易出bug，比如它会遍历Array.prototype的属性与方法等）。循环中的代码每执行一次，就会对数组的元素或者对象的属性进行一次操作。注意：不要使用 for in 语句来循环数组的索引，你可以使用for语句替代。4、forEachforEach() 方法用于遍历数组，无返回值。
2021-11-18 10:27:30
4093
2
原创 JS双击触发2次单击问题解决方案/js区分单击和双击/连续点击事件
开发过程中，我们可能会遇到单击（onclick）和双击（ondblclick）需要实现不同的交互效果。当我们在同一个对象同时绑定了onclick和ondblclick事件，双击对象会执行2次单击事件和1次双击事件。如果我们要把它们做区分，双击事件不会执行单击事件，怎么处理呢？那如果需要实现连续点击事件，我们又该怎么处理呢？请看下文。1、区分单双击事件在单击事件设置一个定时器，执行双击时，不会马上执行定时器里的内容（比如，延时500ms），继而先执行双击事件内容，在双击事件中清除了定时器，这样双击
2021-11-12 17:07:16
7386
原创 localstorage封装(增加缓存前缀、有效时间、数据类型处理等)--实战必备
localstorage封装（ts版）封装后，主要解决了如下问题：1. 增加了缓存前缀。解决了不同项目放在同一个域名下，缓存名称不做区分可能导致重名或者混淆的情况。2. 对缓存的值进行了处理。解决了localStorage的值类型只能为string类型的问题，封装后的set方法可以对json对象类型等数据类型进行直接存储，不需要额外做转换。3. 增加了有效（失效）时间。原生的localStorage保存的数据是没有过期时间的，只能通过手动删除。封装后的缓存可以在读取（get）的时候判断是否过期。
2021-10-26 11:21:46
2675
原创 splice、slice、split、substr、substring、match、replace的区别
1、splice()splice() 方法用于添加或删除数组中的元素。2、slice()slice() 方法可截取数组/字符串中选定的元素。3、split()split() 方法用于把一个字符串分割成字符串数组。4、substr()substr() 方法可在字符串中抽取从 开始 下标开始的指定数目的字符。5、substring()substring() 方法用于提取字符串中介于两个指定下标之间的字符。6、match()match() 方法可在字符串内检索指定的值，或找到一个或多个正则表
2021-10-21 18:29:08
600
原创 github和gitee如何同步发版
推荐两个方法1、直接使用gitee自带的同步功能前提：gitee的仓库项目是通过github导入的满足前提的情况下，可以点击下图红框的icon进行强制同步，这样gitee和github上的代码就能同步了。2、修改.git文件夹中的配置①项目的根目录下有一个隐藏文件夹.git（.git文件夹是git init后在当前目录生成的一个管理git仓库的文件夹）②双击打开，可以看到该文件夹下有个config文件③打开config文件并进行修改，把需要提交到的远程仓库地址加上④最后进行代码推送即可实现
2021-10-14 22:43:36
1611
原创 OpenSSL SSL_read: Connection was reset, errno 10054
一、问题描述提交代码到github上，git报错如下：OpenSSL SSL_read: Connection was reset, errno 10054。看报错提示，极大的可能是由于网络不稳定， 连接超时导致的。二、解决方案方案一：修改git设置，解除ssl验证git config --global http.sslVerify "false"方案二：把git版本更新为最新版
2021-10-14 19:37:24
3991
原创 如何把gitee的项目导入github？（github/gitee项目导入流程讲解）
github/gitee/gitlab项目导入流程操作步骤1、打开github2、点击右上角的加号，弹出卡片，点击“Import repository”3、进入导入界面4、输入要导入的仓库地址和新仓库名称，校验没问题后点击导入按钮即可开始导入TIPS：gitee、gitlab等代码托管平台导入仓库功能的流程都是差不多的，参考着做就得了。
2021-09-26 10:29:36
4515
原创 微前端系列讲解--应用集成方案（qiankun+umi+vue）
1. 微前端架构介绍微前端架构是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。考虑到qiankun作为蚂蚁的微前端架构，具备以下特点：①简单。微应用接入像使用接入一个 iframe 系统一样简单，但实际不是 iframe。②能力完备。几乎包含所有构建微前端系统时所需要的基本能力，如样式隔离、js 沙箱、预加载等。③健壮性值得信赖。在蚂蚁内外经受过足够大量的线上系统的考验及打磨。所以，选择qiankun去构建集成应用项目的微
2021-09-24 22:40:12
7654
原创 引用window自定义变量以及ts在window上自定义变量数据类型报错的解决方案
一、问题描述。举个例子，在TypeScript中，当我们需要给window对象添加全局变量（如testName），或者需要使用window下自定义创建的变量（以testName为例）。会出现以下ts报错：类型“Window & typeof globalThis”上不存在属性“testName”。二、解决方案。1、增加自定义属性声明。2、将window类型强制转换为any。3、使用方括号
2021-09-12 16:42:38
18749
原创 antd pro(ProLayout) mix混合菜单不生效
一、问题描述antd pro的混合菜单模式，算是一种比较新的导航菜单模式，可以让顶部全局导航+侧边导航混合模式同时出现，满足一些特别的需求。ProLayout高级布局组件的API里有一个layout参数，可以设置layout的菜单模式，我们可以在config配置文件做配置。// layout的菜单模式。side：右侧导航，top：顶部导航，mix: 混合菜单layout: 'side' | 'top' | 'mix';那么问题来了，为什么我们把layout设置为mix后，界面的导航菜单看
2021-09-10 07:57:57
5150
3
原创 antd pro项目使用qiankun，loading加载页不消失
一、问题描述antd pro项目开启qiankun作为主应用后，输入项目地址，我们会发现，我们看不到我们想要的页面，呈现在眼前的只是一个加载页，如下图：其实细心的人会发现，该页面存在滚动条，滚动下去即可看到项目当前路由的页面，只是加载页处于上方布局，一直存在不会消失而已。为什么会这样呢？看下图，我们会发现加载页和登录页挂载的dom节点并不一样。loading加载页挂载在id为“root”的dom节点下（antd pro默认挂载节点为root），而登录页挂载在id为“root-master
2021-09-08 12:31:29
3576
2
原创 Error: Module “xxx“ does not exist in container. / antd pro v5启用qiankun报错 / 同时使用mfsu和qiankun报错
Error: Module “xxx“ does not exist in container. / antd pro v5启用qiankun报错 / 同时使用mfsu和qiankun报错终端报错如下：Uncaught (in promise) Error: Module "xxx" does not exist in container.while loading "xxx" from webpack/container/reference/mf
2021-09-06 21:17:07
8558
原创 JS树结构查找节点：找出第一个无叶子节点、找出符合条件（指定）节点
一、树结构二、树查找节点实现方法本文提供三种实现方式。为了做成通用方法，传入两个参数：tree（树）和func（函数，用于传入判断函数）。1、递归实现2、while循环实现3、for循环实现三、具体案例通过上述的树结构以及查找节点实现方法，随便选一种方法调用实现以下案例（非常简单）。1、树结构查找第一个无叶子节点并返回2、树结构查找指定节点并返回查找name值为“节点1-2”的节点
2021-08-16 22:48:23
7280
原创 JS树形数据结构遍历--深度优先遍历和广度优先遍历
一、树结构定义一颗树，JS中常见的树形数据结构如下，children属性对应的是子树二、深度优先遍历（DFS）1、递归实现2、循环实现三、广度优先遍历（BFS）
2021-08-15 20:29:51
6440
原创 ES6--let和const命令
ES6新增了let和const声明变量方式，它们声明的变量仅在块级作用域（其所在代码块）内有效。那么什么是块级作用域？块级作用域这个概念是es6新增的，在此之前，js的作用域只有全局作用域和函数作用域。在平常写代码中，由大括号{}包裹的，都可以理解为块级作用域，也就是说块级作用域是指{}内有效的作用域。比如if条件语句if(){...}、for循环语句for(){...}等等。当然，var声明是没有块级作用域概念的。下面我们通过解答一道常见的面试题来给大家分点详细介绍let和cons
2021-08-13 18:10:15
212
原创 JS中的基本类型和引用类型
JS变量可以划分为两种不同的数据类型：基本类型、引用类型。也有别的叫法，如原始类型和对象类型等。基本类型：undefined、null、Boolean、Number、String、Symbol（ES6）引用类型：除基本类型以外，也可以理解成对象。如Object、Array、RegExp、Date、Function等。一、类型区别二、详细说明1. 值的可变性// 基本类型，以string类型为例let person = '小红'person.age = 16co..
2021-08-12 19:35:40
371
原创 react函数式组件传值之子传父
在用react进行函数式编程时，父组件可以通过props向子组件传值，那么子组件怎么向父组件传值呢？首先，父组件需要向子组件传递一个函数，然后，子组件通过props获取函数并附上参数，最后，父组件通过函数拿到子组件传递的值。一、具体案例父组件：home.tsximport React, { useState } from 'react';import Child from './component/child';import './index.less';const Home: R
2021-08-10 11:07:32
25236
6
原创 react函数式组件传值之父传子
今天我们主要说下react函数式组件如何进行父组件向子组件传值。在开发过程中，为了提高可读性或者复用性，我们会进行组件的拆分。先说下，我们在引入子组件时，子组件的名字一定要大写，否则会报错（这是个babel编译机制问题）。那么，父组件在引入子组件后，如何传值呢？首先，父组件要将传递的参数写到子组件标签上，然后，子组件通过props接收父组件传过来的所有参数。具体看以下案例。一、具体案例案例主要实现一个简单的父组件Home向子组件Child传递count值，子组件通过props拿到此值并渲染出来.
2021-08-06 22:51:41
6766
原创 Centos(Linux)升级git最新版本
在Linux/Centos服务器上，如果使用的git版本过低，使用的时候可能会由于低版本不支持遇到各种问题，比如Centos7系统自带的git版本一般是1.8.3.1的，比较旧，通常建议升级git后再使用。下面我们来说下如果升级git最新版本。1、查看git版本git --version查看当前git版本，和安装2、源代码安装和编译git，需安装一些依赖yum install curl-devel expat-devel gettext-devel openssl-devel zl.
2021-08-04 19:01:53
12027
7
原创 Linux/Centos安装nodejs、npm--npm: command not found
当我们在Linux服务器上部署前端项目（如vue/react项目），我们通常需要用到npm命令去做安装依赖、打包等操作，如果服务器没有安装npm，则会报错：npm: command not found。我们知道，npm是node包管理工具，而现在的nodejs已经集成了npm，所以我们只要安装好node即可。步骤如下：1、下载nodejs稳定版curl -sL https://rpm.nodesource.com/setup_lts.x | bash -2、安装nodejs..
2021-08-03 21:53:35
13515
3
原创 gitlab自动构建（二次构建）报错--fatal: git fetch-pack: expected shallow list
一、问题描述在centos7上搭建gitlab-runner后，第一次自动构建项目成功，第二次后构建项目报错，如下：Reinitialized existing Git repository in /home/gitlab-runner/builds/zBFPsthA/0/root/react-demo/.git/fatal: git fetch-pack: expected shallow listfatal: The remote end hung up unexpectedly.
2021-08-03 00:09:10
4998
原创 GitLab CI/CD 自动化部署没有日志（流水线日志/部署日志/构建日志）-- This job does not have a trace.
如果你在你的gitlab项目中已经配置好gitlab-runner实现自动化构建部署功能（CI/CD），在推送代码到gitlab后，发现已经触发了流水线，任务也执行成功了。但是，就是怎么都看不到流水线日志/部署日志，页面显示This job does not have a trace。这个时候怎么办呢？建议可以考虑下是不是gitlab-runner版本的问题。输入以下命令：gitlab-runner -v。结果显示我安装的版本是9.5.1的，而现在gitlab-runner的版本已经更新到v14了。所以我试
2021-08-01 18:14:43
5089
1
原创 gitlab+gitlab-runner实现前端项目自动化构建部署（CI/CD、Linux、Centos7）
GitLab CI/CD是一套基于GitLab的CI/CD（持续继承/持续交付/持续部署）系统，通过 .gitlab-ci.yml 在项目中配置 CI/CD 流程，系统可以自动地执行任务，完成 CI/CD 操作。（示例的服务器操作系统为Centos7）一、准备工作 1、GitLab服务器 2、创建项目 二、部署gitlab-runner 1、添加 gitlab-runner yum源 2、安装gitlab-runner 3、注册gitlab-runner 4、查看gitlab-runner 三、触发自动化构
2021-08-01 16:55:42
3231
3
原创 react hooks--useReducer用法
useReducer是useState的替代方案，我们可以用它来处理复杂逻辑的state。此外它还可以和useContxt结合实现Redux进行状态管理。基础用法：const [state, dispatch] = useReducer(reducer, initialState, initializer);state：状态变量；dispatch：用于触发reducer函数；reducer：reducer函数，该函数接受state和action两个参数......
2021-07-23 15:24:46
397
原创 GitLab服务器修改管理员用户root密码
我们搭建好GitLab服务，打开页面后，需要输入用户名密码。但它们是什么呢？初始管理员用户为root，密码在安装过程中已随机生成并保存在/etc/gitlab/initial_root_password中，有效期24小时，我们可以自己去查找。如果我们不想去找或者随机密码有效期已过，可以直接对密码进行修改再进行登录，具体操作详见下文。一、重置密码1、切换到相应路径cd /opt/gitlab/bin/2、进入控制台gitlab-rails console3、查询roo...
2021-07-18 14:21:16
14969
原创 GitLab服务器出现502报错解决方案
一、问题说明我在使用我的CentOS服务器成功搭建好GitLab服务后，打开GitLab地址访问时，界面出现的是502的报错，如下图：【说明】服务器用的硬件配置是：腾讯云服务器2核4G，CentOS 7.6 64位系统二、问题排查使用top命令查看系统状况由下图可以看到gitlab占用内存太多（user为git和gitlab-+的全是gitlab的东西），导致服务器崩溃。配置 swap 交换分区新建 2 GB 大小的交换分区：dd if=/dev/zero o
2021-07-18 00:02:44
7866
1
原创 使用清华镜像源安装GitLab（“TCP connection reset by peer“ Trying other mirror）
我们在用Centos7搭建GitLab服务过程中，经常会碰到在下载GitLab镜像的环节，可能会出现由于网络问题访问不到国外源导致报错的情况（"TCP connection reset by peer" Trying other mirror），今天我们来说下如何解决这个问题。说明：以下文章主要针对Centos7搭建GitLab服务在安装GitLab镜像环节出错后写的安装步骤。
2021-07-17 12:20:24
2839
原创 CentOS7搭建GitLab服务器（超详细教程）
一、登录服务器首先，你得有一台服务器。建议配置最低是2核4G。我用的硬件配置是：腾讯云服务器2核4G，CentOS 7.6 64位系统。我们可以借助相关工具去连接服务器并进行命令操作，个人推荐用SecureCRT或者XShell。（写一篇文章介绍SecureCRT用法，包括怎么解决乱码，怎么设置主题、背景色等）二、Centos 7搭建Gitlab服务器在开始前，我们可以先确定下服务器版本使用命令：cat /etc/redhat-releaseCentos7官网教程：
2021-07-17 12:14:43
4638
原创 react hooks--useRef用法
今天来讲一下useRef，我们可以通过它来获取组件实例对象或者DOM对象。除此外，我们还可以用它来进行定义变量，存放值等操作。下面我们来讲useRef最常用的操作，即访问DOM节点。useRef 返回一个可变的 ref 对象，对象里只有一个current属性，返回的 ref 对象在组件的整个生命周期内保持不变。
2021-07-12 22:48:58
4889
原创 umi3.5新特性之提速方案mfsu
umi（插件化的企业级前端应用框架）正式发布了3.5版本，此次更新带来了一个全新的功能：mfsu。mfsu是一种基于webpack5新特性Module Federation（模块联邦）的打包提速方案。开启mfsu可以大幅减少启动项目和热更新所需的时间。在生产模式，也可以通过提前编译依赖，大幅提升部署效率。
2021-07-09 23:26:49
17325
原创 react hooks--useCallback
useCallback类似于useMemo，一般用于做缓存并优化性能，但是需要提醒下大家，不要滥用（比如对一些简单的计算逻辑或许没必要使用它们），否则会适得其反。一、基础用法constmemoizedCallback=useCallback(()=>{doSomething(a,b);},[a,b])useCallback接受两个参数，第一个为回调函数，第二个参数是依赖的数组。我们会发现，useCallback和useMemo的用法很相似，但值得注意的是，u...
2021-07-06 16:41:02
1149
原创 react hooks--useMemo
在函数式组件开发过程中，我们会发现任何一个state值发生变化，组件都会重新渲染。当我们在一些特殊场景需要限定某个state值发生改变再进行渲染或者说项目越来越复杂需要进行渲染优化时，我们就会用到两个用于性能优化的hooks：useMemo和useCallback。今天我们先讲useMemo。一、基础用法constmemoizedValue=useMemo(()=>computeExpensiveValue(a,b),[a,b])useMemo接受两个参数，第一个为回...
2021-07-05 20:23:42
686
原创 react hooks--useContext
在开发过程中，什么时候用到useContext呢？当我们需要跨组件层级进行数据传递，实现共享时，useContext就能派上用场了。一、基础用法1. 声明。使用createContext 方法创建一个 Context 对象，并设置初始值。constMyContext=React.createContext(initialValue)2. 提供。使用Provider为所有子孙后代组件提供要传递的value值。<MyContext.Providervalue={curr...
2021-07-04 00:06:57
359
原创 react hooks--useEffect
useEffect的功能是可以让你在函数组件中执行副作用操作。他可以替代类组件的componentDidMount、componentDidUpdate 和 componentWillUnmount三个生命周期函数。一、基础用法用法1：在组件挂载完成后以及任何数据进行更新后执行，相当于componentDidMount和componentDidUpdate组合。useEffect(()=>{ // To do Something})用法2：useEffect第二个参
2021-07-02 17:18:23
754
原创 react hooks--useState
Hooks的作用：可以让你在不编写class 的情况下使用 state 以及其他的 React 特性。useState的功能：让你在函数式组件中使用state。const[state,setState]=useState<type>(initialValue)state：状态变量setState：用于修改状态的Setter 函数type：（ts）数据类型。当你使用ts的时候，可用此定义数据类型initialValue：状态的初始值，如不填则...
2021-07-01 12:42:48
650
原创 从0到1搭建react后台管理系统项目
如果我们需要从0到1搭建一个全新的企业级web后台管理系统，我们应该怎么做呢？今天我们要讲的是基于react框架，如何从0到1快速搭建一个后台管理系统。主要分为以下几步：1. 安装node.js（基本环境，自带npm）；2. 安装git（版本管理）；3. 安装VSCode（开发工具）；4.使用Ant Design Pro搭建项目。
2021-06-27 22:29:14
3774
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人