- 博客(23)
- 收藏
- 关注
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 掌握 React-Hooks 的正确姿势
掌握 React-Hooks 的正确姿势最近学习了修言大佬的课,感觉受益匪浅,很多不太熟悉或者不那么明白的东西,现在都能明白一二了,但是好记性不如烂笔头,及时的整理知识点以及复盘才能为实践打下坚实的基础,所以我决定对最近的学习做一个小总结。以前从来不会抽出时间特地去系统地学习,总觉得能够知道怎么去用,业务能写,满足需求就可以了,在工作中学的零零散散,所以很多时间想写什么突然就忘记了,得翻出以前写的东西来看一下才能想起来,也总是很依赖同事,有什么不懂的,百度不出来就会问同事,但这样对我个人发展极其受限。
2020-12-22 19:03:57
230
原创 解决vscode配置代码片段不生效的问题
点击文件->首选项->设置代码片段,选择vue.json,然后写入,在index.vue里使用根本不生效。在页面上输入‘shuoming’,就可以直接使用了,省时省力(^-^)V。
2024-02-28 16:57:20
1791
原创 记录在使用element组件时遇到的问题
设置CSS不生效在查找元素时,发现根本不在当前组件样式里,反而和App.vue组件样式平行,是独立的div因为不在当前组件内,所以也不能通过 >>> 或::v-deep 或 /deep/ 深度选择器设置样式设置全局style,去掉scoped就是全局style。
2023-10-21 15:37:01
435
原创 js数字长度超过16位精度丢失
测试测长整型数据的时候,接口返回的数值和UI页面展示的数值不一致,然后我才发现在控制台输出的时候超出16位,精度丢失了。3.让产品更改需求,控制长整型数字位数在16位以内。2.使用decimal.js处理,附上地址。1.让后端专成字符串返回给前端;
2023-03-08 10:48:25
2956
原创 在vue中使用echarts(结合tsx和vue-property-decorator)
需要注意的是:如果要在一个页面里多次使用这个子组件,必须使用ref去挂载echarts实例,感兴趣的小伙伴可以试试如果使用id去挂载的话,会出现什么情况。记录一下刚上手vue出现的一些小问题。
2022-09-09 18:00:38
359
1
原创 浏览器的缓存策略
强缓存:根据服务器响应头字段(Expires或Cache-Control)的过期时间,来判断是否需要发送HTTP请求或者读取缓存数据的一种策略;协商缓存:当强缓存失效之后,浏览器在请求头中携带相应的缓存tag(Last-Modified 或 ETag)来向服务器发请求,由服务器根据这个tag,来决定是否使用缓存;Expires:即过期时间,存在于服务端返回的响应头中,告诉浏览器在这个过期时间之前可以直接从缓存里面获取数据,无需再次请求;Cache-Control:采用过期时长来控制缓存而非具体
2022-05-07 17:08:18
1070
1
原创 实现数组扁平化的方法
在 JavaScript 中实现拍平数组,例如:数组:[1, [2, 3, [4], 5], 6]输出: [1, 2, 3, 4, 5, 6]ES6arr.flat(Infinity);数组中全为数字arr.toString().split(',').map(Number)递归const myFlat = (arr) => { const helper = (arr) => { let res = []; for (const item of arr) {
2022-04-01 11:37:37
497
原创 前端导出csv文件
<Button onClick={exportData}>数据导出</Button>function exportData() { const { conditionData } = toJS(store); const { title } = toJS(prepareStore); const name = title ?? '新图表'; if (conditionData.length === 0) return message.warning
2021-12-23 10:35:09
1144
原创 React项目中使用Antd组件实现记住密码的功能
上代码:export const setCookie = (name, value, expiryDate) => { let currentDate = new Date(); currentDate.setDate(currentDate.getDate() + expiryDate); document.cookie = name + '=' + value + '; expires=' + currentDate;};export const getCookie = nam
2021-12-17 15:11:53
1829
原创 Amap地图折线的简单实现
上代码:import React, { Component } from "react";import { loadMapScript } from "./utils";import { message } from "antd";import "./app.less";import { getProjectPointList } from "./api/asset";let rectangles = [];class App extends Component { state = {
2021-11-22 17:39:49
696
原创 react-custom-scrollbars 滚动条组件的简单实现
滚动条组件参考:gitHub API说明以及大佬的API中文讲解import "./styles.css";import React, { useState, useEffect, useRef, useMemo } from "react";import { Scrollbars } from "react-custom-scrollbars";export default function App() { const ref = useRef(null); const [top, s
2021-09-27 10:34:03
1917
原创 encodeURI、decodeURI、encodeURIComponent以及decodeURIComponent区别
encodeURI:可把字符串作为 URI 进行编码()。对以下在 URI 中具有特殊含义的 ASCII 标点符号,encodeURI() 函数是不会进行转义的: , / ? : @ & = + $ # (可以使用 encodeURIComponent() 方法分别对特殊含义的 ASCII 标点符号进行编码。)。decodeURI: 可对 encodeURI() 函数编码过的 URI 进行解码。encodeURIComponent: encodeURIComponent() 函数可把字符串作为.
2021-07-09 13:43:40
383
原创 使用echarts实现一个柱状散点图(双X轴)
import React, { Component } from "react";import * as echarts from "echarts";export default class App extends Component { state = { data: [] }; componentDidMount() { this.getEchartData(); } componentWillUnmount() { // 组件卸载前卸载图表
2021-07-06 10:07:29
1704
原创 git如何将一个分支上的代码提交到另一个分支
近来入职了新公司,公司的产品代码是多分支的,昨天改了一个小需求,但是当时我要切换另一个分支取提交,然后前端负责人用git命令给我提交了下,以前没遇到过这样的场景,所以记录下。假设我现在在A分支,现在我要把A分支上修改的代码提交到B分支上:git add . :他会监控工作区的状态树,使用它会把工作时的所有变化提交到暂存区,包括文件内容修改(modified)以及新文件(new),但不包括被删除的文件;npm run commit:将暂存区里的改动给提交到本地的版本库(这个是应用了git-cz)下面我
2021-05-19 11:07:00
13469
原创 如何在mac电脑上免费使用GitKraken
这里写自定义目录标题1.下载地址:链接: link 提取码: ah7e2.安装完以后,显示简介3.点击锁定,以免它去更新
2021-05-12 17:23:26
1581
原创 react-calendar日历的简单使用
最近遇到一个新的需求,是要求展示一个日历,而且每天都要显示当天的一个排班班次,UI给我的图就十分类似于钉钉的考勤日历,十分的美观。首先那肯定是找一个插件来改,挑来挑去,我最后选中了react-calendar这款功能强大的日历组件。需求:我司对于高保真的要求十分低,基本上只要功能实现,页面不丑,就OK,所以我最后组件的样式不能说是和设计图一模一样,可以说是毫不相干嗷。需求也很简单如下:能够在日历上展示每天对应的班次;班次不同,日期样式不同(颜色不一致);可以查看不同月份的班次情况以及点击某一天显
2020-12-29 17:07:02
6025
5
原创 最简单的react-devtools安装教程
最简单的react-devtools安装教程1.去gitHub上下载地址:https://github.com/facebook/react-devtools2.解压到本地目录,安装依赖例:cd /Users/apple/Downloads/react-devtools-masternpm --registry https://registry.npm.taobao.org install3.打包扩展程序安装依赖成功以后:npm run build:extension:chrome
2020-12-17 13:09:04
357
2
原创 js函数防抖和节流
函数防抖事件触发后延迟执行动作,适用于频繁触发的事件,如在百度搜索输入搜索内容,输入时不执行搜索,停止输入后经过一小段延迟执行搜索展示搜索结果。函数防抖的实现关键是对setTimeout函数的应用此为笔者项目中的搜索例子// 查询 searchChange = (val) => { if (val) { this.setState({ searchVal: val }); //实时变化值 clearTimeout(this
2020-07-05 23:15:31
557
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人