- 博客(470)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 记录自己灵感闪现的开发语录 每日更新 记录变强或者变得更菜的过程
2018年8月6日 今日博客排名115万+ 1、大多数人不想成为菜鸟，但现实是大多数人是菜鸟，包括我。
2018-08-05 12:50:32
429
原创 React 供应商选择组件 - 使用Ant Design渲染Select并与父组件Form同步数据
这样，可以在父组件中使用SupplierSelect组件，并将其与Form同步数据。通过调用setSelectedSupplier函数来更新父组件中selectedSupplier的值，从而保持数据的同步性。
2024-05-21 22:36:17
168
原创 react 如何 写 类似 vue的插槽
在 React 中，没有直接对应于 Vue 的插槽（slot）的概念，但你可以通过一些方法模拟类似的功能。Vue 的插槽允许你在子组件的模板中预留一些位置，以便父组件可以插入自定义的内容。在 React 中，你可以使用 props.children、高阶组件（HOC）、Render Props 或 React 16.2+ 引入的 React.Fragment（或简写为 <>）和函数式组件来模拟插槽。
2024-05-16 17:18:23
310
原创 React useState 的调用规则与最佳实践：为何不在条件语句内使用 useState
如果你希望基于某个条件来渲染某个组件或组件的某个部分，并且这个条件影响了状态的使用，那么你应该在组件的顶层检查这个条件，并基于这个条件来渲染相应的JSX。React Hooks 的规则之一是，你应该在函数组件的顶层调用它们，而不是在循环、条件或嵌套函数中。这是因为Hooks的调用顺序在React中是非常重要的，并且React依赖于这个顺序来正确地管理组件的状态。例如，假设你有一个组件，该组件基于某个条件来渲染不同的内容，但都需要使用某个状态变量。是在函数组件的顶层调用的，而不是在。都将在整个组件中可用。
2024-05-15 09:41:11
173
原创 React 中 Ant Design Upload 组件的异步 action 设置
在 React 中使用 Ant Design 的 Upload 组件时，如果需要在 action 属性中动态地设置一个基于某个异步状态（比如 storeAuth.url）的值，需要确保在 action 被设置之前 storeAuth.url 已经有了有效的值。如果使用的是函数组件和 Hooks，可以使用 useState 和 useEffect Hooks 来管理状态和副作用。确保有一个状态管理库（如 Redux、MobX、Context API 等）来管理 storeAuth 状态。
2024-05-14 23:15:50
201
原创 masl系列-根据用户名和密码获取token
相反，Microsoft建议使用更安全的授权流程，如Authorization Code Flow 或 Device Code Flow。这些流程更安全，因为它们不需要直接使用用户名和密码。请注意，这种方法存在一些限制和风险，因此在实际应用中，最好避免使用它。使用用户名和密码直接获取令牌（通常称为资源所有者密码凭据流程）是不推荐的，因为它具有潜在的安全风险，可能导致令牌被滥用或泄露。这种方法需要将用户名和密码直接传递给客户端应用程序，这可能会增加安全风险，因为用户名和密码可能会被拦截或盗窃。
2024-05-04 21:21:52
210
原创 为什么 ts 现在 不推荐 写 export default，还是export const 一个变量
在TypeScript中，虽然仍然是有效的，但在某些情况下，它已不再被视为最佳实践。相反，使用命名导出（named exports）的方式更具可读性，并且可以更清晰地表达出导出的内容。
2024-04-27 10:38:31
197
原创 前端项目文件夹命名，用横线好，还行下划线好
对于前端项目文件夹的命名，通常建议使用短划线（横线），因为它是在 Web 开发中较常见的命名风格，并且在 URL 中使用短划线可以更清晰地表示单词之间的分隔。这种命名风格也符合许多流行的前端框架和工具的约定，比如 Vue.js 和 Angular。
2024-04-27 10:18:20
226
2
原创 electron ipcRenderer.invoke 和 ipcMain.handle 介绍
是 Electron 主进程中的一个方法，用于处理从渲染进程发送过来的IPC请求，并返回一个Promise。渲染进程可以使用方法发送IPC请求到主进程，并等待主进程处理完成后返回结果。
2024-04-27 09:48:43
572
原创 electron 中的 ipcMain 介绍
在 Electron 应用中，ipcMain是主进程中的一个模块，用于处理与渲染进程之间的进程间通信。Electron应用程序通常分为两个主要的进程：主进程和渲染进程。主进程（通常是main.js文件）负责应用程序的生命周期、创建和控制浏览器窗口等任务，而渲染进程则运行在每个浏览器窗口中，负责页面的渲染。ipcMain模块允许主进程接收来自渲染进程的同步或异步消息，并可以发送回复。这使得主进程和渲染进程能够交换数据并执行特定的任务。基本用法。
2024-04-27 09:08:51
354
原创 error This project‘s package.json defines “packageManager“: “yarn@[email protected]“. However the current
遇到这个问题，重新安装低版本的yarn就行。
2024-04-26 23:54:00
362
原创 宝塔面板mysql允许root账号登录
直接通过宝塔面板创建的mysql数据库，root是只允许localhost访问的，下面需要配置允许所有IP人员，都能访问。
2024-04-26 11:59:39
212
原创 Electron中使用Prisma（以SQLite为例）
在上面的示例中，我们首先引入了 Prisma 客户端模块，并创建了一个 Prisma 客户端实例。然后，我们定义了一个异步函数 getUsers()，用来查询数据库中的所有用户数据并打印到控制台。可以使用 Prisma 客户端代码来操作数据库。在 Electron 中，我们可以在主进程或渲染进程中使用 Prisma。文件中，通过定义模型来创建数据库表。这将创建一个新的文件夹，包含了必要的文件和目录结构。命令来更新数据库模型和客户端代码。
2024-04-26 10:05:20
394
原创 Electron vue 进程间消息通行
在 Electron 应用中，IPC（Inter-Process Communication，进程间通信）是一种允许主进程（main process）和渲染进程（renderer process）之间交换数据的方式。ipcRenderer.send 在渲染进程中调用， ipcMain 的事件监听器在主进程中设置。
2024-04-25 14:54:56
342
1
原创 zustand关于状态变化，是写在内部，还是外部
在Zustand内部定义状态和操作函数，并通过useStore hook来访问状态和操作函数，可以更好地组织代码，并且避免了不必要的重复代码。此外，将逻辑写在Zustand内部还可以更好地利用Zustand的自动订阅和更新机制，确保状态的一致性和可靠性。总的来说，将逻辑写在Zustand内部可以使代码更加清晰和易于维护，同时也能更好地利用Zustand提供的功能和优势。因此，建议将逻辑写在Zustand内部，并在需要修改状态时使用内部的操作函数来更新状态。
2024-04-23 16:53:06
396
原创 next14报错“getStaticProps“ is not supported in app
正在做next12到next14的升级，在next14中，推荐把代码写到app中，所以当我把next12中的page的页面，复制到next14中的app目录中，报错。
2024-04-21 11:22:14
250
原创 i18next serverSideTranslations 的使用
提供的一个方法，用于在服务器端获取翻译数据并传递给页面组件。这可以确保页面在首次加载时就包含所需的翻译数据，从而提高性能和。方法来实现国际化，确保页面在服务器端加载时就包含所需的翻译数据。是一个流行的国际化（i18n）库，它可以帮助应用程序中实现多语言支持。方法在服务器端获取翻译数据，并将其传递给页面组件。然后将返回的翻译数据作为 props 传递给页面组件。集成的官方插件，它提供了一种简单的方式来在。下面是一个示例代码，演示如何在。应用程序中实现国际化。在上述示例中，我们通过。通过这种方式，可以在。
2024-04-20 18:07:42
139
原创 Next实现 i18n 传递 locales 给 getStaticPaths
获取到传递的语言版本信息，然后根据这些语言版本生成对应的动态路由路径。通过这种方式，可以在 Next.js 中实现国际化，并在。下面是一个示例代码，演示如何在。文件定义可用的语言版本，并将这些。来生成多语言版本的动态路由路径。在上述示例中，通过配置。2、在页面组件中使用。
2024-04-20 16:55:56
312
原创 Next 中 getStaticPaths 和 getStaticProps 配合使用
用于获取动态路由对应页面的数据。通过配合使用这两个函数，可以实现动态路由的静态生成页面，并在构建时获取相应的数据。中一起使用的两个函数，用于实现动态路由和静态生成页面的数据获取。如果参数是不确定的或需要动态获取，可以在。可以很好地配合使用，实现动态路由的静态生成页面和数据获取。请注意，如果您的动态路由参数是在构建时已知的，可以在。用于生成动态路由的路径，而。中根据参数获取数据。在使用这两个函数时，
2024-04-20 16:37:05
263
原创 nextjs getStaticProps 和 getServerSideProps 区别
用于服务器端渲染页面，适用于需要每次请求时动态获取数据的情况。根据页面的需求和数据更新频率，您可以选择合适的函数来获取数据并注入到页面中。中用于数据获取的两个重要函数，它们在页面渲染时分别起到不同的作用。用于静态生成页面，适用于不频繁变化的内容，而。
2024-04-20 16:26:22
214
原创 next server 组件 加载client 组件，使用suspense
在Next.js中，你可以使用next/server模块中的suspense功能来实现组件的异步加载。这通常用于在服务端渲染时处理异步数据获取的场景。提供的一个高阶组件，它用于包装异步组件，以便在服务端渲染时处理异步加载的逻辑。特有的API，不是React的一部分，因此它不会在不支持。是一个通过代码分割的方式异步加载的组件。
2024-04-20 09:48:50
256
原创 React函数组件，不能直接将 ref 属性传递给组件，需要使用 React.forwardRef 来包裹组件以支持 ref
【代码】React函数组件，不能直接将 ref 属性传递给组件，需要使用 React.forwardRef 来包裹组件以支持 ref。
2024-04-15 10:41:55
133
原创 在React类组件中引用在其他文件中创建的zustand状态store
如果想在React类组件中引用在其他文件中创建的。导出并在类组件中引入使用。您可以在其他文件中创建。以下是一个示例，展示了如何在其他文件中创建。生命周期方法中使用该钩子来获取和更新状态。，并将其导出，然后在类组件中引入并使用该。，并在React类组件中引入和使用该。在上面的示例中，我们在。
2024-04-14 14:01:41
251
原创 zustand状态库在react类组件中使用
通常与函数式组件一起使用，但也可以在类组件中使用。如果想在React类组件中使用。状态管理库，可以在类组件中调用。钩子来访问和更新状态。
2024-04-14 13:53:41
330
原创 代码开发常见模块引入顺序规范
类型定义或常量（例如：ColumnType、InquiryOrderItemTableGetColOptions）根据以上规范，你可以将给出的模块按照对应的组别进行整理，以符合规范的引入顺序。这种规范有助于提高代码的可读性和维护性。
2024-04-13 09:19:24
225
原创 vite 全部引入模块和按需应入模块，打包大小区别，结论无区别
是指在打包过程中，工具会分析代码中的依赖关系，只将被引用的模块打包进最终的输出文件，未被引用的模块会被剔除。这样可以减小最终打包文件的体积，提高加载性能。这两种方式引入模块的打包结果是一样的，因为 Vite 在打包时会进行 Tree-shaking（树摇）优化。Vite 都会只打包被实际引用的部分，因此最终打包后的文件大小是一样的。在 Vite 中，使用。
2024-04-13 09:14:52
92
原创 vite打包大小可视化rollup-plugin-visualizer
在 Vite 项目中使用 rollup-plugin-visualizer 插件可以可视化分析打包后的文件大小。当运行打包命令后，会生成一个名为 stats.html 的文件，可以在浏览器中打开该文件来查看可视化的打包分析报告。在上面的配置中，filename 参数指定生成的可视化分析报告的文件路径，title 参数指定报告的标题。
2024-04-12 23:49:00
331
原创 zustand的UseBoundStore特性
库中的一个高级特性，它允许你创建一个新的钩子函数，该钩子函数只会订阅状态容器（store）中特定部分的状态，而不是整个 store。这有助于优化 React 组件的性能，因为只有当关心的状态发生变化时，组件才会重新渲染。需要注意的是，尽管 UseBoundStore 提供了更细粒度的状态订阅，但过度使用它可能会导致代码变得复杂。这种方法的优势在于它允许你更精细地控制组件的渲染行为，减少不必要的重新渲染，从而提高应用性能。方法返回的是一个新的钩子函数，它接受一个选择器函数作为参数。
2024-04-11 09:03:50
230
原创 FormData apend 几个变量，然后打印，不能直接打印出数据
在上面的代码中，我们首先创建了一个FormData实例，然后使用append方法向其中添加了三个键值对。of循环来遍历FormData对象的条目，并使用entries方法获取每一对键和值，然后将它们打印到控制台。对象的设计初衷是为了与XHR（XMLHttpRequest）或Fetch API一起使用，以发送表单数据，因此它并不是为了直接打印到控制台而设计的。上面的代码展示了如何查看其内容，但它并不提供一个直接的字符串表示形式。这将会打印出一个包含所有键值对的字符串，每对键值占一行。
2024-04-10 17:34:26
261
原创 antd react 上传组件 customRequest 讲解
的上传组件会使用内部的请求逻辑来处理文件上传。但是，很多时候，我们需要根据自己的业务需求来定制上传逻辑，比如添加认证信息、使用特定的 HTTP 请求库、处理复杂的上传流程等。这时，我们就可以使用。（Ant Design）是一个流行的 React UI 库，提供了丰富的组件以帮助开发者快速构建美观且功能强大的用户界面。是一个函数，它会在用户选择文件并触发上传时被调用。是一个非常重要的属性，它允许开发者自定义上传文件的请求逻辑。下面是一个简单的示例，展示了如何使用。），另一个是一个用于中断上传的函数（
2024-04-10 10:40:13
745
原创 react类组件转化为函数组件
2、**处理状态和生命周期：**如果类组件中有状态（state）和生命周期方法（如 componentDidMount、componentDidUpdate 等），可以使用 React Hooks 来处理状态和副作用。在上面的示例中，我们将一个简单的计数器类组件转换为函数组件。1、**提取渲染逻辑：**将类组件中的 render() 方法中的 JSX 代码提取出来，作为函数组件中的返回值。3、**转换类组件为函数组件：**将类组件的类定义转换为一个函数定义，并在函数中返回之前提取的 JSX 代码。
2024-04-09 16:10:11
426
原创 react ant design 通过函数弹出 modal窗口
通过以上步骤，当按钮被点击时，会弹出一个Modal窗口显示指定的内容。在Modal.info方法中，可以根据需求设置Modal的标题、内容和按钮点击事件等。中，可以通过调用Modal组件的方法来动态弹出和关闭Modal窗口。
2024-04-09 13:47:19
521
原创 mac 怎么在 iterm 中 打印文件路径 树结构
在 macOS 的 iTerm 终端中，可以使用 tree 命令来打印文件路径的树状结构。这里 -L 选项后跟的数字代表树的最大深度。
2024-04-09 09:36:39
519
instantclient_12_2.zip
2019-09-27
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人