- 博客(31)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 React Hooks---useState/useEffect/useContext的基本使用
useStateuseState是react自带的一个hook函数，它的作用就是用来声明状态变量.useState这个函数接收的参数是我们的状态初始值,它返回了一个数组，这个数组的第 [0]项是当前当前的状态值，第 [1]项是可以改变状态值的方法函数。import React,{useState} from "react"export default ()=>{ let [count,setCount] = useState(0); let addCount = ()=&g
2022-03-04 17:23:37
696
原创 ssh配置git
1.配置个人信息git config --global user.name '用户名'git config --global user.email '用户邮箱'2.首先生成ssh key，在终端中执行ssh-keygen首先生成ssh key，在终端中执行3.然后把公钥内容复制，公钥的位置在~/.ssh/id_rsa.pub.# 复制公钥cat ~/.ssh/id_rsa.pub | clip # Windows cat ~/.ssh/id_rsa.pub | pbco
2022-03-02 11:23:12
512
原创 form表单label加问号图标以及提示词
<i class="el-icon-question" style="color:#2c68ff"/>添加问号图标用el-tooltip包裹图标，使鼠标移到图标显示提示词<template slot="label">使用插槽实现再表单label中添加文字+图标<el-form-item prop="businessDomain"> <template slot="label"> <span&.
2021-08-11 11:42:28
4003
4
原创 解决elementui中多层弹窗el-dialog遮挡现象
弹窗套弹窗遮罩层解决方法：在内层嵌套的el-dialog中使用append-to-body提升z-index<el-dialog append-to-body>。。。。。</el-dialog>解决后的效果：
2021-07-29 10:34:29
2339
原创 js实现二叉树遍历
前序遍历(根左右)递归function fn(root){ if (root == null) return [] ; const result = []; function preorder(root) { if (root == null) return; result.push(root.val); preorder(root.left, result); preorder(root.
2021-07-21 15:02:10
820
原创 js实现快排,冒泡,归并排序
function quick_sort(arr,i,j){ var left = i; //哨兵i var right = j; //哨兵j var key = arr[i]; //标准值 if(i<j){ while(i < j){ while(arr[j] >= key && i < j) j--; if(i<j) arr[i++] = arr[j]; while
2021-07-21 13:50:07
141
原创 elementUI表格合并单元格
ElementUI 官方文档给的合并单元格的例子是死数据，但是我们一般渲染到页面的表格数据都是通过调用后端接口返回来的数据。这就要求我们自己去判断 rowspan 的参数，根据数据的相同行（或列）进行合并；想要的实现效果如下：实现过程用到的方法：:span-method="objectSpanMethod" 核心代码如下：页面<el-table :data="historytList" :span-method="objectSpanMethod" border> ..
2021-07-13 16:31:20
653
原创 vue+element开发中tabs只加载该标签页下的数据，动态加载其他tab下的数据
实现要求：打开当前界面时，只加载当前标签页数据组件内容，而不是默认的将所有标签页都加载完毕，而是在切换标签页时候，加载数据。方法：添加v-if判断，在当前标签页时，就将其对应的isShow设为true<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tab-pane v-if="isShow" name="queryFeature">xxx</el-tab-pane> <el
2021-07-13 15:51:13
3586
2
原创 el-table实现双击单元格完成复制的功能
1.在el-table标签上添加cell-dblclick事件<el-table :data="eventList" @cell-dblclick="celldblclick" > ...</el-table>cell-dblclick函数有四个参数，分别是row, column, cell, event；row就是被操作单元格所在行的所有的数据cloumn可以看到被操作单元格的property，根据property可以再row中得到该单元格的值；cell
2021-07-06 12:32:12
2433
原创 如何修改elementUI提供的el-select组件的样式-select组件popper-class用法
官网提供的：下拉框的样式，它并没有在el-select里面，而是放在了最外层，如下图：popper-append-to-body：默认是true，改成false就可以起作用。显而易见，官方默认把下拉部分加入到里，所以我们可以通过popper-append-to-body这个属性使其不加到body里，让其回归到对应el-select里面，就是把下拉部分，放回对应结构中去。既然加入到el-select里面了，我们就可以使用css选择器找到对应层级去设置对应样式了，依然可以实现上图中的效果方法二：
2021-07-01 18:40:02
2463
原创 elementUI中table组件-表头字段加图标
el-table-column加图标效果如下：实现代码如下：使用template代替:label=“xxx”<el-table-column show-overflow-tooltip prop="interfaceName”> <template slot="header"> <span>接口名称</span> <i class="iconfont icon
2021-06-18 13:54:28
5102
2
原创 elementUI表格树结构以及展开一行：表格A中展开一行中的表格B，需要展示的内容一致，即表格A，B共用一个表头
要实现的结果图如下：具体js代码实现如下：展开一行使用<el-table-column type="expand" >里面套表格B去掉内表格B的表头（:show-header=“false”）以及调整展开一行的padding将外表格A与内表格B的字段宽度保持一致<el-table :data="versionList"> <template slot="empty"> <table-empty></table-empty&
2021-06-18 11:27:49
962
原创 键盘回车事件导致页面刷新的问题
<fin-form :label-position="left"> <fin-form-item :label="xxx" class="search-box"> <fin-input :placeholder="xxx" clearable @keyup.enter.native="bySearch" ...
2021-06-11 09:30:24
115
原创 前端调用后端接口-文件导出
导出操作方法function export(arg1,arg2) { axios({ url: xxx, method: 'post', data: {},//参数 }).then(resp => { //成功 const blob = new Blob([JSON.stringify(resp .data)], { type: 'application/json' }); const fileN
2021-06-02 15:58:35
1765
原创 elementui表单el-form-item的label旁加icon并加提示
原代码：<el-form-item prop="name" :label="$t('JieKouYingWenMingCheng')"> <el-input v-model="addInfo.name" :placeholder="$t('QingShuRu')" :disabled="isQuote"></el-input></el-form-item>解决方法去掉 上面的
2021-05-27 10:03:28
11195
原创 渲染图层(Render Layer)与复合图层(Graphics Layer)关系
两者都是为了让HTML元素在2D平面堆叠出3D的视觉效果。简单的理解就是，拥有层叠上下文属性的元素会生成一个新的层叠上下文对象，每个层叠上下文对象都是一个渲染图层，渲染图层与复合图层是不同的概念，渲染图层更像是一个纯二维的概念，无论其怎么层叠覆盖最终都归依于根层叠上下文。而复合图层则完全脱离根层叠上下文，相当于开辟新的位面。层叠上下文层叠上下文(stacking context)，是HTML中一个三维的概念。在CSS2.1规范中，每个盒模型的位置是三维的，分别是平面画布上的X轴，Y轴以及表示层叠
2021-05-20 18:42:07
1620
原创 white-space与word-wrap
white-spacewhite-space是作用于空格和回车上的，用于控制：1. 空格是否合并2. 回车是否解释成折行 3. 句子太长是否在有空格处折行取值：normal | nowrap | pre | pre-wrap | pre-linenormal：多个连续的空格会被合并成一个；回车会被忽略；句子很长会被折行；nowrap：多个连续的空格会被合并成一个；回车会被忽略；句子很长也不会折行；pre：空格不会被合并；回车对应换行数；句子长了不会折行；pre-wrap：空格不
2021-05-20 14:04:42
651
原创 HTTP1.0 /1.1 /2.0对比
HTTP1.0是一种无状态、无连接的应用层协议HTTP1.0规定浏览器和服务器保持短暂的连接，浏览器的每次请求都需要与服务器建立一个TCP连接，服务器处理完成后立即断开TCP连接（无连接），服务器不跟踪每个客户端也不记录过去的请求（无状态）。这种无状态性可以借助cookie/session机制来做身份认证和状态记录。而下面两个问题就比较麻烦了。首先，无连接的特性导致最大的性能缺陷就是无法复用连接。每次发送请求的时候，都需要进行一次TCP的连接，而TCP的连接释放过程又是比较费事的。这种无连接的
2021-05-20 11:06:08
257
原创 FC，BFC和IFC的理解
FCFC的含义就是Fomatting Context。它是CSS2.1规范中的一个概念。它是页面中的一块渲染区域。而且有一套渲染规则，它决定了其子元素将怎样定位。以及和其它元素的关系和相互作用。BFC和IFC都是常见的FC。分别叫做Block Fomatting Context 和Inline Formatting Context。BOX一个页面是由很多个 Box 组成的，元素的类型和 display 属性决定了这个 Box 的类型。不同类型的 Box，会参与不同的 Formatting C
2021-05-20 10:13:43
622
转载 windows环境下：nrm ls 报错internal/validators.js:124 throw new ERR_INVALID_ARG_TYPE(name, ‘string‘, value)
报错截图：1、首先检查node.js是否安装成功，输入 node -v 若可查看版本号，如图所示即安装成功；若不一致则重新安装node.js。node.js官方下载地址：https://nodejs.org/en/download/2.查看npm是否安装成功，如下图成功，反之则重新安装3、报错截图中可见 cli.js文件中 第17行报错，按路径找到该文件：打开文件找到报错的第17行，注掉原17行改为如图：//const NRMRC = path.join(process.env.H
2021-05-13 11:27:12
229
原创 vue-i18n中的$t用法
vue-i18n中的$t用法$t 是 vue-i18n 提供的全局方法1、在 main.js 中引入 vue-i18n import Vue from 'vue'; import VueI18n from 'vue-i18n'; Vue.use(VueI18n);//// 通过插件的形式挂载2、准备本地的翻译信息const messages = { zh: { message: { hello:'好好学习，天天向上！' } }, en: {
2021-04-30 19:36:25
16027
4
原创 node.js
node的使用node多版本安装方式：卸载已有的node.js下载nvm在c盘下创建目录dev，dev里面创建两个子目录nodejs和nvm；把下载的nvm包解压到dev中的nvm包里，此时你会看到此包有一个install.cmd，右击以管理员身份运行，直接回车，生成一个文件，另存为setting.txt到当前目录，打开此文件修改里面的root：nvm的目录路径（C:\dev\nvm）和path:path的目录路径（c:\dev\nodejs）配置nvm和node的环境变量系统属性下->
2021-04-17 12:02:07
68
原创 Mac 安装 brew（最新教程，绝对可行，一行代码搞定，不报错）
由于第一次使用mac，现在安装brew，一会报这个错，一会儿报那个错，上网查了很多教程，用了很多时间都是不可以，电脑开VPN翻墙也不行。Warning: The Ruby Homebrew installer is now deprecated and has been rewritten inBash. Please migrate to the following command: /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.
2020-08-14 19:20:15
2525
6
原创 bootstrap-table 表头和内容对不齐解决办法
bootstrap-table 表头和内容对不齐解决办法表格的表头和内容对不齐，特别是列比较多且有分页时候最明显,相信很多同学，也遇到过这样的问题解决方法打开bootstrap-table.js 找到 BootstrapTable.prototype.resetView方法，找到如下代码：if (this.options.showHeader && this.options.height) { this.$tableHeader.show();
2020-08-13 18:10:15
1240
3
原创 bootstrap-table使用搜索和排序属性应该注意的问题
使用bootstrap-table的搜索和排序属性应注意的问题1.不能设置sidePagination: "server"2.1事件responseHandler: function(res) {}直接return 响应的数据即可2.2不能对响应的数据做以下的处理3.初始化表格的过程中设置4.表格columns的设置5.最后附上我实际运用的初始化表格代码1.不能设置sidePagination: “server”2.1事件responseHandler: function(res) {}直接return
2020-06-15 23:28:29
1047
原创 mongodb的下载与配置（详细）
先去官网下载一个windows版本的mongodb安装包，根据自身电脑系统选择32位还是64位。安装比较简单,一直next就好了，勾选上，点击 Next。这里比较重要，选择Custom，意思是自定义安装，选择了这个可以自定义安装路径。点击Browse在弹出框 Look in: 位置选择你的安装路径，点击OK点击Next点击Next击点Install，开始安装。点击Finish，安装成功。到此，mongodb就安装成功了，挺简单的，但难点是，还要把mongodb设置成W
2020-05-22 12:35:43
494
1
原创 webpack的基本使用
webpackwebpack是一个前端资源打包工具，他将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源webpack的基本使用先初始化项目 npm init -y-需要安装的webpack包以及第三方加载器的包 npm install webpack -D npm install webpack-cli -D npm install webpack-dev-server -D //为了避免每次修改代码之后都执行webpack命令，则
2020-05-18 09:58:59
134
原创 node.js的多版本安装，模块化导出导入以及node实现服务器的功能
node的使用node多版本安装方式：卸载已有的node.js下载nvm在c盘下创建目录dev，dev里面创建两个子目录nodejs和nvm；把下载的nvm包解压到dev中的nvm包里，此时你会看到此包有一个install.cmd，右击以管理员身份运行，直接回车，生成一个文件，另存为setting.txt到当前目录，打开此文件修改里面的root：nvm的目录路径（C:\dev\nvm）和path:path的目录路径（c:\dev\nodejs）配置nvm和node的环境变量系统属性下->
2020-05-15 20:30:14
173
原创 react的使用、react的创建方式、react的生命周期
react的使用需要安装的包 npm install react npm install react-dom基本使用：在js中引入包 import React from 'react' import ReactDOM from 'react-dom'使用react的createElement创建需要渲染的元素，使用createElement创建元素由三个参数，分别是：第一个参数，表示要创建的元素类型，第二个参数表示要要创建元素的属性，第三个参数表示当前元素的子节点
2020-05-14 21:37:56
201
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人