- 博客(52)
- 收藏
- 关注
RSS订阅原创 Typescript
TypeScript文章目录TypeScript前言一、TypeScript简介和其开发环境的搭建简介开发环境的搭建二、TypeScript的静态类型自定义静态类型三、TypeScript基础静态类型和对象类型基础静态类型对象类型四、类型注释和类型推断type annotation 类型注解type inferrence 类型推断五、函数参数和返回类型定义六、数组类型的定义七、元组的使用和类型约束八、interface 接口十、类的概念和使用十一、类的访问类型十二、类的构造函数前言一、TypeScri
2020-12-24 18:06:25
575
2
原创 随笔——带有loading的select
带有loading的selectimport React, { useEffect } from 'react';import { Select, Spin } from 'antd';import { useRequest, request } from 'umi';import { useImmer } from 'use-immer';export interface Employee { id: number; employeeName: string; employeeCo
2020-12-22 15:00:17
909
原创 随笔
随笔文章目录随笔一、pandas是什么？二、使用步骤1.引入库2.读入数据总结一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下（示例）：import numpy as npimport pandas as pdimport matplotlib.pyplot as pltimport seaborn as snsimport warningswarnings.filterwarnings(
2020-12-22 14:10:23
371
原创 随笔——ant design中column上width属性设置无效问题
列参数：export interface Column { title: string; width?: number; dataIndex?: string; fixed?: string; ellipsis?: boolean; defaultSortOrder?: string; sorter?: any; align?: string; sortOrder?: string | boolean; render?(text?: number | string,
2020-12-21 17:19:01
2872
1
原创 随笔——文本域（计数方式：已输入/可再输入）
样式：.text-area_box { position: relative; .ant-input { height: 121px; background: #ffffff; border: 1px solid #d9d9d9; border-radius: 3px; } .word_number { position: absolute; bottom: -2
2020-12-21 16:50:07
766
原创 随笔——一些常用样式的设置
一些常用样式的设置文章目录一些常用样式的设置一、一行或者多行文本显示省略号二、ant design-form表单去掉必填项前面的星号*及后面的冒号三、flex四、底部固定的Footer五、重置样式一、一行或者多行文本显示省略号// 一行或者多行文本显示省略号.omitCommon { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical;}.d
2020-12-17 16:29:32
224
原创 随笔——history跳转页面后，获取参数
跳转页面通过history.push({ pathname: '/intent/handle/ProcessIntentOrder', query: { id: record.id, checkFlag: false } });// 到跳转页面后const { query = {} } = props.location;console.log(query.checkFlag, '查看还是处理'); // 获取到的会是一个字符串false，所以最好记得是将checkFlag:
2020-12-16 17:30:12
2624
原创 随笔——直接触发表单验证中的某一个（ant design——form）
如何直接触发表单验证中的某一个比如：设置为undefined后先让其直接就出来提示，可以设置form.validateFields(['名字']); form.setFieldsValue({ briefUrls: undefined // 为了让其有提示 }); form.validateFields(['briefUrls']);...
2020-12-16 17:27:39
2235
原创 随笔——倒计时（当前日期距离规定日期的时间差）
import React, { useEffect } from 'react';import { useImmer } from 'use-immer';export type CdFormat = 'dd:hh:mm:ss' | 'hh:mm:ss' | 'hh:mm' | 'mm:ss';interface IProps { startDate: string | Date; endDate: string | Date; format?: CdFormat; cb?():
2020-12-16 17:15:10
187
原创 随笔——时间跨度超过XXX的日期置灰不可选择（ant design-RangePicker）
**状态** const [validDateFlag, setValidDateFlag] = useImmer<boolean>(false); const [dates, setDates]: any = useState([]); const [hackValue, setHackValue]: any = useState(); const [dateValue, setDateValue]: any = useState();**方法** // 不可选的日期范围
2020-12-16 16:47:55
845
原创 随笔——密码校验（ant design）
密码不能小于六位，至少含字母、数字、特殊字符其中的2种！ <Form.Item name="initPassword" label="初始密码" rules={[ { type: 'string', message: '密码不能小于六位，至少含字母、数字、
2020-12-16 16:12:09
1379
原创 随笔——时长（过去多长时间HH:mm:ss）
import dayjs from 'dayjs';import React, { useEffect } from 'react';import { useImmer } from 'use-immer';export type CdFormat = 'HH:mm:ss' | 'HH:mm' | 'mm:ss';interface IProps { startDate: string | Date; format?: CdFormat; cb?(): void;}const
2020-12-16 16:01:02
152
原创 在js中调出一个弹窗
// 在js中实现弹出一个弹窗const { confirm } = Modal;confirm({ title: '提示', content: '是否确定对所选档案进行启用？', onOk() { startConfirm(selectedRowKeys); }, onCancel() { console.log('Cancel'); } });..
2020-12-11 15:11:06
364
1
原创 随笔——倒计时
<CountDown format="hh:mm" startDate={new Date()} endDate={text} /* cb={() => { console.log('倒计时结束'); }} */ />**CountDown组件如下：**import React, { useEffect } ...
2020-11-27 15:39:24
82
原创 随笔——git相关
先拉取最新master分支，然后将master合并到本地分支：git checkout mastergit pullgit checkout 本地分支git merge mastergit status（这个命令可以检查一下，然后没有push的话就会提示让push，所以最好push一下）将dev分支合并到test分支（假如现在就在dev分支）：git checkout testgit pullgit merge devgit pushgit status本地项目更改远程仓库地址说明.
2020-11-26 17:17:39
68
原创 随笔——遍历数组，将内外层结构一样的数组重新构建得到想要的数据结构的新数组
const transformData = (params, showData) = >{ const arr = showData; params.map((item, index) = >{ if (item.children.length) { const brr = []; arr.push({ title: item.name, value: item.code, children: transfo
2020-11-26 16:42:25
280
原创 wrappedComponentRef获取子组件的实例
class A extends Component { cRef = React.createRef(); 。。。。 // 调用B组件实例的方法showModal this.cRef.current.showModal(); 。。。。。 // 使用wrappedComponentRef <B wrappedComponentRef={this.cRef}/> // 也有下面的这种使用方式(就可以不使用上面的 React.createRef()) <M.
2020-09-23 11:13:12
1554
原创 前端如何优雅的处理类数组对象
常见的几种类数组对象：arguments对象arguments 对象；function fun() {return arguments;}fun(1,2,3)// Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]NodeList（比如 document.getElementsByClassName(‘a’) 得到的结果；document.getElementsByTagName(‘img’)// H.
2020-09-21 15:34:20
250
原创 统计出现次数最多的三个节点（即标签）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>
2020-09-18 14:30:54
429
原创 随笔--返回数组中和为一个规定值的的两个数
一个数组中的两个数和为一个值，返回对应的数，比如【1,2,3,4,5】，让和为5，则结果就是1,4，可以输出其对应索引为【0,3】function sum(arr, result){let obj={};for(var index=0;index<arr.length;index++){let num = arr[index];if(num in obj){return [obj[num], index]}else{obj[result -num]=index;}}}...
2020-09-18 09:42:34
89
1
原创 umi中使用scss
第一步：npm i node-sass sass-loader --save第二步：在.umirc.ts或者.umirc.js中加入以下代码即可cssLoaderOptions:{localIdentName:’[local]’}原因是因为：结构：打开浏览器的控制台查看sources找到引用的css文件，搜索可以看到好像我们的样式确实是存在的，只不过被加上了前缀及后缀加上上面的代码后：...
2020-09-17 17:04:14
1067
原创 npm & yarn差异
yarn1、yarn add <package…>这会在你的系统中安装一个或多个软件包，且会加至package.json中的dependencies中。2、yarn add <package…> [–dev/-D]使用–dev或-D将安装一个或多个软件包在你的devDependencies。npm1、npm install会将package.json中dependencies和devDependencies的部分都会被安装；2、npm install XXX什么都不.
2020-07-09 15:26:44
190
原创 react/umi随笔
1、项目迁移index.tsx中文件修改为（这样一来就是props.children里的盒子是谁就是谁，解决再有其他div包含）import React from ‘react’;const BasicLayout: React.FC = props => {return (<React.Fragment>{props.children}</React.Fra...
2019-11-23 17:23:25
388
原创 React 中减少不必要的嵌套
React 中有一个Fragment，可以通过它无需向DOM添加额外包含节点。render() { return ( <React.Fragment> <A /> <B /> <C /> </React.Fragment> );}有时候可能会需要用到键值key 就比如要创...
2019-11-23 16:54:12
132
原创 React动态导入及css模块化
在react中有时候看似没有进入某个组件，但是已经进入了某个组件里面，下面是我之前遇到的问题1、虽然webFlag为true，按理说应该进入pc端（前者），但是移动端也一起加载了出来<classroomContext.Provider value={this.state} >{webFlag === true ? : }{webFlag === true ? : }{w...
2019-11-23 16:42:13
2857
原创 横竖屏监测及设置html字体大小
/* 横屏竖屏 */ (function (): void { const supportOrientation = (typeof window.orientation === 'number' && typeof window.onorientationchange === 'object'); const init = func...
2019-10-18 17:51:19
208
原创 滚动鼠标，判断是下滚还是上滚
/** *滚动鼠标，判断是下滚还是上滚 * * 判断滚轮向上或向下在浏览器中也要考虑兼容性，现在五大浏览器（IE、Opera、Safari、Firefox、Chrome）中Firefox 使用detail，其余四类使用wheelDelta； * 两者只在取值上不一致，代表含义一致，detail与wheelDelta只各取两个值，detail只取±3，...
2019-10-03 17:55:28
704
原创 判断访问终端
//判断访问终端 var browser = { versions: function () { var u = navigator.userAgent, app = navigator.appVersion; return { trident: u.indexOf('Trident') > -1, //IE内核 ...
2019-10-03 17:52:16
179
原创 判断是否安装了flash插件
// 判断是否安装了flash插件 function flashChecker() { var hasFlash = 0; //是否安装了flash var flashVersion = 0; //flash版本 if (document.all) { var swf = new ActiveXObject('Shockwa...
2019-10-03 17:51:16
215
原创 表情emoji
判断是否输入emoji // 判断是否输入emoji function isEmojiCharacter(substring) { for ( var i = 0; i < substring.length; i++) { var hs = substring.charCodeAt(i); if (0xd800 <= hs &...
2019-10-03 17:27:40
420
原创 查找一个字符串中的所有子串的位置
/** *查找一个字符串中的所有子串的位置 * * */ function searchSubStr(str: any, subStr: any, positions: any): void { let pos = str.indexOf(subStr); while (pos &g...
2019-10-03 15:18:21
989
原创 解决 CHROME FLASH 不能自动播放的问题及加载视频前的“黑色背景”如何改变
chrome中flash不能自动播放，相信很多人都遇到了这个问题，网上检索的话，很多都会提到添加muted，当时尝试了这个方法，根本不起作用。后来慢慢发现一种情况：当单独在根节点中放入video后，可以自动播放，后来又发现宽度必须要大于一定值，否则还是不行，自己当时尝试到300（300也可以），250就不行了，如果在一个标签里或者一个盒子里嵌套了video，那么这个盒子的宽度也必须大于...
2019-10-03 15:04:29
1237
4
原创 小感
来到这工作已有三个月，三个月说长不长，说短不短，这段时间有一些感悟，用于自我规范，如果对屏幕前的你也有用的话，那就更开心了。 已经好几个月没有写博客了，这一段时间也有时间写，但是总想着等积累到一定的东西后再写，如今觉得这种想法是大错特错的。哪怕是每天遇到的小问题都可以写下来，而且有些问题当时解决时可能花费了大量的时间，如若不记下来，过后可能就忘记了，做笔记应该当成一个习惯，...
2019-10-02 18:21:51
136
原创 路由之间传值及路由守卫
路由守卫路由守卫分为以下几种：全局守卫：beforeEach（是路由的钩子函数，在每一个路由跳转之前执行，常做登录权限判断，参数to，from，next）后置守卫：afterEach（在跳转之后执行，参数to和from）全局解析守卫：beforeResolve（参数to，from和next，在beforeEach之后，afterEach之前）路由独享守卫：beforeEnter组内路由...
2019-04-01 18:01:57
1693
1
原创 vue之template标签及插槽slot
template<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="...
2019-03-21 20:46:27
42923
1
原创 vue中路由嵌套及页面传参
main.jsimport Vue from 'vue'import App from './App.vue'import router from './router'Vue.config.productionTip = falsenew Vue({ render: h => h(App), router, // 相当于 router: router, 在创建Vue实例...
2019-03-21 20:37:33
1444
原创 vue之filter与watch
filter 过滤器 在实例内部可以通过filters定义一个过滤器 过滤器可以对输入的数据进行过滤显示, 多个过滤器可以拼接, 拼接的时候多个过滤器用 | 进行分割,分割的值依次在前者基础上进行<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <...
2019-03-20 21:54:12
712
原创 vue中computed与methods区别
计算属性是依赖于其他值发生改变的，当关联值发生改变之后才会重新计算method是在页面渲染的时候就会重新调用。在使用的时候如果调用次数特别多会影响执行效率在开发的时候建议根据实际情况进行选择<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta na...
2019-03-20 21:37:50
227
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人