闭包 陷阱react hook

公共Hooks封装之请求参数useQueryParams

项目环境 Vue3.x + Ant Design Vue3.x + Vite3.x 此篇内容讲解的是关于公共 Hooks 封装之表格数据 useTableData 中暴露出来与 queryParams 的一些方法,而进行封装的 Hooks,其目的在于减少冗余重复代码的书写。 封装分解:参数定义 co ......
useQueryParams 参数 Hooks

公共Hooks封装之文件下载useDownloadFile

写在前面 对于经常需要开发企业管理后台的前端开发来说,必不可少的需要使用表格对于数据进行操作,在对于现有项目进行代码优化时,封装一些公共的 Hooks. 本篇文章为useDownloadFile.js 基于个人项目环境进行封装的 Hooks,仅以本文介绍封装 Hooks 思想心得,故相关代码可能不适 ......
useDownloadFile 文件下载 文件 Hooks

react ant-mobile的input组件,使用ref实现失焦方法

// 设置ref<Input ref={inputRef} placeholder='信息保密,仅用于投保' className='pos-app-phone tkzx-rr-block' clearable type='tel' maxLength='11' onChange={(val) => ......
ant-mobile 组件 方法 mobile react

Vue3自定义一个Hooks,实现一键换肤

核心 使用 CSS 变量, 准备两套 CSS 颜色, 一套是在 light 模式下的颜色,一套是在 dark 模式下的颜色 dark 模式下的 CSS 权重要比 light 模式下的权重高, 不然当我们给 html 添加自定义属性[data-theme='dark']的时候, dark 模式权重比 ......
Hooks Vue3 Vue

react+antd-mobile+vite移动端H5前端项目

React+antd-mobile+vite ($\color{red} {注意:} $)待解决问题 (1)高版本路由第一次切换tab跳路由会出现闪烁,路由切换会延迟导致tab无法触发active(预计和缓存组件不更新路由参数有关) (2)使用ReactDOM.createRoot实例化项目,在结合 ......
前端 antd-mobile 项目 mobile react

react打包优化,使用cdn加载第三方库,cdn加速网页

1、安装 pnpm install html-webpack-externals-plugin customize-cra react-app-rewired 2、在项目根目录下新建config-overrides.js文件,package.json中改为react-app-rewired 启动和打 ......
第三方 cdn 网页 react

React函数式组件避免无用渲染的方案

在class组件中可以使用shouldComponentUpdate钩子函数,但是函数式组件中是没有这种钩子函数的,那么在函数式组件中来达到类似的效果呢? 答案是:React.Memo,如以下使用案例: // 父组件 const [values, setValues] = useState({ a: ......
函数 组件 方案 React

react 将项目打包成一个js文件,并且使用 Radio Canada 字体

https://fonts.google.com/?stroke=Sans+Serif&preview.text=AI%20Assistance%20Experience&query=Noto+Sans 下载字体 放到项目中 再index.ts 中引入 import ttf from "./asse ......
字体 文件 项目 Canada react

读算法霸权笔记09_信用数据的陷阱

1. 信用评级模型 1.1. 评估个人贷款违约风险的模型为FICO 1.1.1. 唯一评分参数就是贷款者的资产,主要依据是贷款者的债务负担和账单支付记录 1.1.2. 这种信用评分模型相对透明 1.1.3. 信用评分行业受政府管制 1.1.4. 信用评分系统的使用得到了广泛普及 1.2. 脸书就发明 ......
霸权 算法 陷阱 信用 笔记

hook和callback学习

转自:https://www.zhihu.com/question/501933636,https://www.cnblogs.com/ArsenalfanInECNU/p/12871887.html 1.介绍 回调函数:传递一个函数指针,供另一个模块调用。 当想通过一个统一接口实现不同的内容,这时 ......
callback hook

【react.js + hooks】useRef 搭配 Houdini 创造 useRipple

水波纹点击特效 really cool,实现水波纹的方案也有很多,笔者经常使用 material 组件,非常喜欢 mui 中的 ripple,他家的 ripple 特效就是通过 css Houdini 实现的。 今天,我们将复刻一个 ripple,并封装成 hooks 来使用! CSS Houdin ......
useRipple Houdini useRef react hooks

React 类组件转换为函数式

函数式的 React 组件更加现代,并支持有用的 hooks,现在流行把旧式的类组件转换为函数式组件。这篇文章总结了转换的一些通用的步骤和陷阱。 ......
函数 组件 React

闭包

什么是闭包? 闭包就是有权访问另一个函数作用域中变量的函数。 简单理解就是:闭包是用来连接函数外部和内部的桥梁。 如何从函数外部来访问另一个函数内部的变量呢? 举个例子 // 当函数外部想要访问另一函数内部的变量时,需要使用return function outer() { let n = 10; ......
闭包

bitset优化传递闭包

bitset优化传递闭包 时间复杂度 \(O(\frac{n^3}{w})\) #include<bits/stdc++.h> #define F(i,l,r) for(int i=l;i<=r;++i) #define G(i,r,l) for(int i=r;i>=l;--i) #define ......
闭包 bitset

react项目经验,以及一些骚写法

语法糖 1.const logged = !!getToken(); 这里的`!!`是求布尔值的快捷方式 类似的: 2.var a=b*1 是转数字的快捷方式 3.var a=b+'' 是转字符串的快捷方式 架构相关 1.webpack 2.qiankuan 通过package.json 可以查看r ......
写法 经验 项目 react

使用hook封装表格常用功能(react)

实现内容 配置分页:usePagination 生成过滤项:useFilter 获取表格选择配置:useSelect 生成批量删除按钮:useDelete 生成模态框:useModal 示例 render部分: <React.Fragment> <Form layout="inline"> {Del ......
表格 常用 功能 react hook

react 文件选择器

export type FileSelectorType = { emit: boolean; type: "file" | "dir"; callBack: (path: string, fileList: FileList) => void; }; export const FileSelect ......
文件 react

SpringBoot:整合前端(Vue、React)代码合并SpringBoot项目中打成war包运行

获取前端dist包 前端的dist包就是通过 npm run build 命令生成的包,生成的包结构如下 合并到static文件夹 打开SpringBoot项目 -> resources -> 创建 static 文件夹 将前端dist包内的文件复制到static文件夹内 引入 freemarker ......
SpringBoot 前端 代码 项目 React

【 react 】《 React实现图片比对效果 》

这里使用 img-comparison-slider 组件进行实现,官网地址如下 https://img-comparison-slider.sneas.io/examples.html#always-show 实现效果 拖动中间分割线来切换展示旧图片与新图片 安装组件 ## 安装组件 npm in ......
效果 图片 react React

实现异步循环--闭包

让我们试着写一个异步方法,每秒打印一次循环的索引值。 for (var i=0; i<5; i++) { setTimeout(function(){ console.log(i); }, 1000 * (i+1)); } 如上程序的输出为: > 5 > 5 > 5 > 5 > 5 这明显是有问题的 ......
闭包

React 页面崩溃问题

今天遇到一个页面崩溃问题,很神奇的是初始化打开的时候会崩溃,但是切到其他内容,再切回来又好了 因为 React 是 prod 的版本,所以报错其实没卵用,最后定位到这个代码上: 尝试了下,一个组件,return null 或者 return false 都是 work 的,但是 return und ......
页面 问题 React

React Hook 之 Effect :同步与外部系统的数据

有时组件中的数据需要与外部系统的数据或操作同步,React提供了Hook Effect。 Effect 会在组件渲染后运行一些代码,以便将组件与 React 之外的某些系统同步,包比如浏览器 API、第三方小部件,以及网络请求等。 如以下的video播放器的简单加载: // 声明 Effect im ......
数据 Effect 系统 React Hook

洛谷B3611 【模板】传递闭包 floyd/bitset

目录floydbitset优化 题目链接:https://www.luogu.com.cn/problem/B3611 参考题解:https://www.luogu.com.cn/blog/53022/solution-b3611 floyd #include <bits/stdc++.h> usi ......
闭包 模板 bitset B3611 floyd

【教程】React Native 应用中的代码混淆与安全性管理

​ 混淆是指对源代码进行加密、重命名等操作,以增加代码的复杂度,使其难以理解和反编译。 在React Native中,混淆可以通过以下步骤实现: 1. 将JavaScript源代码转换为基于本机平台的二进制代码,可以使用工具如Metro Bundler或babel进行转换。 2. 使用混淆工具,例如 ......
安全性 代码 教程 Native React

【代码混淆】react-native 代码混淆

​ 【代码混淆】react-native 代码混淆 使用react native开发app,实现代码混淆的操作。 无论是加密还是运行时虚拟机,最后都可以通过执行时调试把代码反向生成出来原来的代码,虽然能抵御低端的黑客攻击,但是对高端黑客却形同虚设。 代码混淆是通过修改源代码结构和变量名,使得代码难以 ......
代码 react-native native react

React拖拽效果实现

基于 React 的拖拽效果 Demo 一个基于 React 的拖拽功能实现的 Demo. 两个关键点 1, draggable 属性 2, drag 事件 draggable 属性 img 标签默认是支持拖拽的, 当时其他 HTML 标签, 想要其拖动的话, 需要为其添加 draggable="t ......
效果 React

【Python微信机器人】第六七篇: 封装32位和64位Python hook框架实战打印微信日志

目录修整 目前的系列目录(后面会根据实际情况变动): 在windows11上编译python 将python注入到其他进程并运行 注入Python并使用ctypes主动调用进程内的函数和读取内存结构体 调用汇编引擎实战发送文本和图片消息(支持32位和64位微信) 允许Python加载运行py脚本且支 ......
Python 机器人 实战 框架 机器

JS逆向快速定位关键点之通用hook脚本

大部分网站都会对关键参数进行加密,JS 逆向时,我们首要任务是定位参数具体的加密逻辑。 常见方式包含:关键字搜索、堆栈调试、XHR 及事件监听、AST 内存漫游、JS Hook 注入等 本篇文章以 JS Hook 注入 为切入点,在做JS逆向往往需要定位到一些关键参数位置去分析,比如Cookie、S ......
关键点 脚本 关键 hook

组合式函数hook

什么是“组合式函数”? 在 Vue 应用的概念中,“组合式函数”(Composables) 是一个利用 Vue 的组合式 API 来封装和复用有状态逻辑的函数。类似与vue2中mixin(混入) 当构建前端应用时,我们常常需要复用公共任务的逻辑。例如为了在不同地方格式化时间,我们可能会抽取一个可复用 ......
函数 hook

react_hooks系列 useMemo

一、概念和作用​ 写在函数式组件里的 “函数调用代码”。如果函数式组件重新渲染时,每次都会执行“调用函数的代码”。如果不是必须的,那么就是性能的浪费。useMemo就是解决这个问题的。即:useMemo是防止不必要的的函数调用。 ​ 文字描述总是让你很难理解。很抽象。还是要看代码的。 格式:useM ......
react_hooks useMemo react hooks
共1260篇  :2/42页 首页上一页2下一页尾页