qq_31182399
码龄7年
  • 10,021
    被访问
  • 29
    原创
  • 130,004
    排名
  • 0
    粉丝
关注
提问 私信
  • 加入CSDN时间： 2015-09-09
博客简介：

qq_31182399的博客

查看详细资料
  • 1
    领奖
    总分 71 当月 4
个人成就
  • 获得2次点赞
  • 内容获得4次评论
  • 获得7次收藏
创作历程
  • 1篇
    2022年
  • 13篇
    2021年
  • 15篇
    2020年
成就勋章
TA的专栏
  • 身份证验证
    1篇
兴趣领域 设置
  • 前端
    javascriptcsses6前端框架
  • 微软技术
    typescript
  • 小程序
    小程序
  • 最近
  • 文章
  • 资源
  • 问答
  • 帖子
  • 视频
  • 课程
  • 关注/订阅/互动
  • 收藏
搜TA的内容
搜索 取消

js防抖函数

function debounce(func, delay) { let timer;　// 通过闭包使timer一直存在内存中 return function (...args) { if (timer) { clearTimeout(timer); 　　} timer = setTimeout(() => { func.apply(this, args); //通过apply还原this指向事件 }, delay) }
原创
发布博客 2022.01.06 ·
284 阅读 ·
0 点赞 ·
0 评论

react 获取循环列表的ref

import React, { useEffect, useState,useRef } from 'react';import styles from './index.less';const Address: React.FC<{}> = (props) => { const liRefList = useRef([]); const getRef=(dom)=>{ liRefList.current.push(dom) } useEffect(()=>
原创
发布博客 2021.06.02 ·
824 阅读 ·
0 点赞 ·
0 评论

upload 上传文件

一、封装import React, { useState, useEffect, useRef } from 'react';import styles from './index.less';import { useDispatch, useSelector } from 'dva';import { Form, Input, Button, Upload, message, Spin, Modal } from 'antd';interface propType { onsuccess:
原创
发布博客 2021.05.28 ·
184 阅读 ·
0 点赞 ·
0 评论

js 生成16位随机唯一id

export const RandomId = (n: number) => { var str = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G','H','I','J','K', 'L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']; var res = ''; for (var i = 0; i < n; i++)
原创
发布博客 2021.05.28 ·
462 阅读 ·
0 点赞 ·
0 评论

在谷歌浏览器中调试React+Redux构建的项目，快速找到源文件

前端调试项目时，项目是基于webpack打包的，所以在谷歌浏览器中，只能找到打包后的文件，而不是打包之前的项目源文件，这样不便于前端的调试。怎么在Source下打开想要调试的文件呢，有如下解决办法。一 、非webpack构建的项目下，快速查看相关的代码　F12打开调试面板、打开source栏、点击open file（或者ctrl+p）、输入需要调试的文件名，然后就可以开始进行调试了。![在这里插入图片描述](https://img-blog.csdnimg.cn/202105281027411
原创
发布博客 2021.05.28 ·
154 阅读 ·
0 点赞 ·
0 评论

数值处理方法

export function dataprocessing(text: string | number,fontSize:number=14) { if (!isNaN(text) && text!=null && text!="") { return ( <span style={{ color: text > 0 ? '#E73A3A' : text < 0 ? '#2A9B43':'#000',fontSize:fontSize
原创
发布博客 2021.05.27 ·
22 阅读 ·
0 点赞 ·
0 评论

获取cookie 设置cookie

export const setCookie = (name, value) => { const Days = 30; // 此 cookie 将被保存 30 天 const exp = new Date(); // new Date("December 31, 9998"); exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); document.cookie = `${name}=${escape(value)};exp
原创
发布博客 2021.05.25 ·
13 阅读 ·
0 点赞 ·
0 评论

导出文件功能支持ie

import axios from 'axios';export const exportFile = async (url: any, data: any, fileNames: string, req?: string) => { const token = localStorage.getItem('token'); const file = await axios({ method: req || 'post', url, responseType: 'a
原创
发布博客 2021.05.25 ·
33 阅读 ·
0 点赞 ·
1 评论

css实现超出多行...

width: 215px; font-size: 14px; height: 36px; font-family: PingFangSC, PingFangSC-Regular; font-weight: 400; text-align: justify; co...
原创
发布博客 2021.05.25 ·
36 阅读 ·
0 点赞 ·
0 评论

js 数组取交集

一、数组结构不相同let arr1 = [ {fpcid: "2da37fdfe66140089dc3367b21cc6194", name: "34"}, {fpcid: "2da37fdfe66140089dc3367b21cc6195", name: "33"}, {fpcid: "2da37fdfe66140089dc3367b21cc6196", name: "35"}];let arr2 = [ {fpcid: "2da37fdfe66140089dc3367b21cc6194",
原创
发布博客 2021.05.25 ·
34 阅读 ·
0 点赞 ·
0 评论

【Umi】通过配置 dynamicImport loadingComponent 实现加载效果

在前端单页面应用中，子页面的代码都是当用户访问到的时候，才会异步去加载子页面的代码。如果子页面代码较大，那么会给用户一段时间的卡顿感，很影响使用体验。所以，我们想在加载子页面代码时，显示 loading 组件，从而优化体验。在 Umi 中，可以通过简单的配置，即可实现。1、编写loading组件:npm install --save nprogressimport React, { useEffect } from 'react';import NProgress from 'nprogres
原创
发布博客 2021.05.25 ·
207 阅读 ·
0 点赞 ·
0 评论

js 回到顶部丝滑效果

//监听页面滚动 window.addEventListener('scroll', changeScrollTop); //控制隐藏显示 if(document.documentElement.scrollTop > 400){ setshowTop(true) }else { setshowTop(false) } //回到顶部-动画 const obj = document.getElementsByTagName('html')[.
原创
发布博客 2021.04.15 ·
96 阅读 ·
0 点赞 ·
0 评论

ant design 文件下载

文件下载 //导出报表const exportExel = () => { axios({ method: 'post', url: '/insMngGjzy/comb/attribution/export', responseType: 'arraybuffer', data: { combId: Number(id), type: tempOthers?.type || 4, startD.
原创
发布博客 2021.04.15 ·
548 阅读 ·
0 点赞 ·
0 评论

ant design List长列表下拉刷新 上拉加载更多

1、html import styles from './index.less'; import { ListView,List,PullToRefresh } from 'antd-mobile'; const Item = List.Item; const Brief = Item.Brief; const { theadData, data, total, currentPage, onSuccess, onSuccessEnter, isMore, showNum,refreshing
原创
发布博客 2021.04.15 ·
906 阅读 ·
0 点赞 ·
0 评论

React中使用react-router-dom路由

安装首先进入项目目录，使用npm安装react-router-dom：npm install react-router-dom --save-dev //这里可以使用cnpm代替npm命令新建router.jsimport React from 'react';import {HashRouter, Route, Switch} from 'react-router-dom';import Home from '../home';import Detail from '../detail';
原创
发布博客 2020.11.20 ·
123 阅读 ·
0 点赞 ·
0 评论

css 实现 table斜线表头

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=ut
原创
发布博客 2020.10.21 ·
411 阅读 ·
0 点赞 ·
0 评论

前端H5实现多图片上传并预览

利用input 的type='file" 可以实现文件的上传，不过只支持单个文件上传。只有给input加上multiple属性才能实现多个文件同时上传。<div class="input-file-box"> <span>点击上传图片</span> <input type="file" name="" id="uploadfile" multiple></div><div id="img-box"></div>j
原创
发布博客 2020.10.15 ·
365 阅读 ·
0 点赞 ·
0 评论

h5页面手机表情转码

function utf16toEntities(str) { var patt = /[\ud800-\udbff][\udc00-\udfff]/g; // 检测utf16字符正则 str = str.replace(patt, function (char) { var H, L, code; if (char.length === 2) {
原创
发布博客 2020.10.13 ·
100 阅读 ·
0 点赞 ·
0 评论

ionic4 入门 (四) 路由守卫

判断用户是否登录 , 在进入购物车和个人中心 界面的时候, 如果用户没有登录, 需要让用户先进入登录界面创建守卫ionic g guard guard/loginGuard CanActivate : 路由进入前守卫canActivateChild ：路由进入子组件守卫CanDeactivate ：路由离开守卫CanLoad :是否加载模块CanActivate state.url 获取要跳转的路由 存到sessionStorage里 当登录成功之后直接跳到这个路由提升用户体验度imp
原创
发布博客 2020.09.22 ·
124 阅读 ·
0 点赞 ·
0 评论

ionic4监听返回事件 AppMinimize navController

引入appminimize 插件 ionic cordova plugin add cordova-plugin-appminimize npm install --save @ionic-native/app-minimize@beta 在 app.module.ts 中注入 appminimize 并且在providers 中注入 import {AppMinimize} from '@ionic-native/app-minimize/ngx';![在这里插入图片描述](https://im
原创
发布博客 2020.09.22 ·
208 阅读 ·
0 点赞 ·
0 评论
加载更多