weixin_43852916的博客

rc-resize-observer监听页面元素

React状态管理

简单说一下思路Form.List 的列表增加的同时编号自增，效果图：获取上一个框的值然后获取的是一个字符串，如果是数字字符串就需要自增，如果不是，则不显示值字符串转数字加1的话前面000,就没有了所以加完1再转字符串加000下面是支持的是个位进位 let res = form.getFieldValue('cardList'); let str = res[res.length - 1]?.cardNo;

createFromIconfontCN当我们使用antd内置的字体图表已经不能满足日常开发的时候，antd内置了与阿里矢量图标衔接的方法： Icon.createFromIconfontCN,找到图标生成Symbol代码，可以放到CDN，也可以放到本地。import { createFromIconfontCN } from '@ant-design/icons';const IconFont = createFromIconfontCN({ scriptUrl: '//at.alicd

permissionimport { Checkbox, Tree } from 'antd';import { CheckboxChangeEvent } from 'antd/lib/checkbox';import type { DataNode, EventDataNode } from 'antd/lib/tree';import _ from 'lodash';import { FC, useState } from 'react';import { store, toCreate.

Chain可以说是 lodash 中最为重要的部件，想要用lodash进行复杂的多步操作都离不开chain的帮助。首先说说Chain的调用方式有两种：一种是显式调用(Explicit Chaining)，一种是隐式调用(Implicit Chaining)。//下面的例子采用了ECMAScript2015的语法：//显式调用例子如下:let numbers = [1, 2, 3, 4, 5];let sumOfEvenSquares = _.chain(numbers) //注意numbers放

当浏览器遇到type="text"与type="password"的input标签紧邻时，会触发浏览器自动填充行为。默认为黄色背景。既然浏览器遇到type="text"与type="password"的input标签紧邻时触发自动填充行为，则将两个input隔开，使用隐藏的方式“欺骗”浏览器，将密码信息填写在隐藏区域。.is-hidden { position: absolute; left: -10000px; top: -10000px;}复制代码 /让input看

去掉Antd表单input的右侧查看图标（之类的）可在当前input 内加 allowClear={false}

import { Map, APILoader,Geolocation } from '@uiw/react-amap';import {message} from 'antd'import {FC} from 'react'import {store} from '../../store'const Maps:FC = ()=>( <Map zoom={4} // center={[116,38]} //根据坐标定位位置 > <Geolocation

在useRef中的使用import {useRef} from 'react'import type {FormInstance} from 'antd'const formRef = useRef<FormInstance>();在ProTable中的使用 export interface TableListItem { id:number; status: string; describe:string; typeName: string;}<Pro

css的规则都是全局的 任何一个组件的样式规则 都对整个页面有效。产生局部作用域的唯一方法 就是使用一个独一无二的class名字 不会与其他选择器重名 但是我们与其他人共同开发的时候 无法保证一定与其他人不同 这时候就要用到css modules下面是React组件App.jsimport React from "react"import style from './App.css'export default ()=>{ return ( <h1 classNam

什么是TypeScriptTypeScript是javascript的超集它对JS进行扩展，向JS中引入了类型的概念，并添加了许多新的特性TS代码需要通过编译器编译为JS 然后再交由JS解析器执行TS 完全兼容JS,换言之 任何TS代码都可以直接当成JS使用相比较JS而言 TS拥有了静态类型 更加严格的语法 更强大的功能；TS可以在代码执行前就完成代码的检查，减少了运行时异常的出现的几率；TS代码可以编译为任意版本的JS代码。可有效解决不同JS运行运行环境的兼容问题 同样的功能，TS的

类型简述一些React的内置类型React.ReactElement ---- 使用React.createElement创建 可以理解为React中的JSX元素React.ReactNode ---- xxxx xxx的合法类型React.CSSProperties —组件内联的style对象的类型React.RefObject ----React.createRef创建的类型，只读不可改React.MutableRefObject ----useRef创建的类型，可以修改组件

import { useInterval } from 'ahooks';import { useState } from 'react';export function useCallNumberLogin() { const [timeCount, setTimeCount] = useState(-1); const [interval, setInterval] = useState<number | null>(null); const [isTurn,setIsTu