- 博客(257)
- 资源 (18)
- 收藏
- 关注
RSS订阅翻译 Redux文档十RTK Query 高级
缓存标签可以是 ‘Post’ 或 {type: ‘Post’, id}端点可以根据结果和参数缓存键提供或无效缓存标签端点对象包括发起请求、生成结果选择器、匹配请求动作对象的功能端点可以定义 transformResponse 回调来在缓存之前修改数据可以为 Hooks 提供 selectFromResult 选项来提取/转换数据组件可以读取整个值并使用 useMemo 进行转换。
2026-06-17 09:57:52
24
翻译 Redux文档九RTK Query 基础
RTK Query 是一个强大的数据获取和缓存工具。它旨在简化在 Web 应用中加载数据的常见情况，无需自己手动编写数据获取和缓存逻辑。RTK Query 包含在 Redux Toolkit 包中，其功能建立在 Redux Toolkit 中的其他 API 之上。建议使用 RTK Query 作为 Redux 应用中数据获取的默认方法。之前为每种不同的数据类型（例如帖子、用户和通知）定义了单独的 slice。
2026-06-17 09:55:16
23
翻译 Redux文档八性能、标准化数据和响应逻辑
memoized 选择器函数可用于优化性能Redux Toolkit 从 Reselect 重新导出 createSelector 函数，生成 memoized 选择器仅当输入选择器返回新值时，memoized 选择器才会重新计算结果记忆化可以跳过昂贵的计算，并确保返回相同的结果引用可以使用多种模式来通过 Redux 优化 React 组件渲染避免在 useSelector 内部创建新的对象/数组引用 - 这些会导致不必要的重新渲染。
2026-06-17 09:52:38
19
翻译 Redux文档七异步逻辑和数据获取
在使用 Redux 数据 中，了解了如何在 React 组件内部使用来自 Redux Store 的多条数据，在分派操作对象之前自定义操作对象的内容，以及在 reducer 中处理更复杂的更新逻辑。到目前为止，使用的所有数据都直接位于 React 客户端应用内部。然而，大多数实际应用需要通过调用 HTTP API 来获取和保存项目来处理来自服务器的数据。在本部分中，将转换社交媒体应用以从 API 获取帖子和用户数据，并通过将新帖子保存到 API 来添加新帖子。
2026-06-17 09:49:56
27
翻译 Redux文档六使用 Redux 数据
每次我们调用 useSelector 时，都已经编写了选择器函数，例如。在这种情况下，选择器是内联定义的。选择器通常作为切片文件中的独立函数编写。它们通常接受整个 Redux RootState 作为第一个参数，也可能接受其他参数。可以将选择器编写为切片文件中的独立函数。已经看到 createSlice 需要 name、initialState 和 reducers 字段，并且还接受可选的 extraReducers 字段。
2026-06-17 09:46:08
11
翻译 Redux文档五基本 Redux 数据流
Redux 应用有一个 store，它通过<Provider>组件传递给 React 组件reducer 总是通过复制现有状态值并使用新数据修改副本来不可变地计算新状态使用 Redux Toolkit 的 createSlice 函数生成 “slice reducer” 函数，并可以编写 “mutating” 代码，这些代码将转换为安全的不可变更新。
2026-06-17 09:44:54
11
翻译 Redux文档四 Toolkit 应用结构
可以使用 Redux Toolkit configureStore API 创建 Redux 存储configureStore 接受 reducer 函数作为命名参数configureStore 自动设置存储并具有良好的默认设置Redux 逻辑通常组织成名为 “slices” 的文件“slice” 包含与 Redux 状态的特定功能/部分相关的 reducer 逻辑和操作Redux Toolkit 的 createSlice API 提供的每个单独的 reducer 函数生成操作创建者和操作类型。
2026-06-17 09:41:50
13
翻译 Redux文档三概述和概念
Redux 是一种用于管理和更新全局应用状态的模式和库，其中 UI 触发名为 “actions” 的事件来描述发生的事情，单独的更新逻辑 “reducers” 更新状态以响应。它充当需要在整个应用中使用的状态的集中存储，并通过规则确保状态只能以可预测的方式更新。1、Redux 是一个用于管理全局应用状态的库Redux 通常与 React-Redux 库一起使用，将 Redux 和 React 集成在一起Redux Toolkit 是编写 Redux 逻辑的标准方式。
2026-06-16 10:56:38
17
翻译 Redux文档二快速入门
1、使用 configureStore 创建 Redux 存储configureStore 接受 reducer 函数作为命名参数configureStore 自动设置存储并具有良好的默认设置2、向 React 应用组件提供 Redux 存储在<App />包裹在一个组件内部将 Redux 存储作为传递3、使用 createSlice 创建 Redux “slice” reducer使用字符串名称、初始状态和命名化简器函数调用 createSlice。
2026-06-16 10:54:49
19
翻译 Redux文档一介绍
Redux 是一个用于可预测和可维护的全局状态管理的 JS 库。它可以帮助你编写行为一致、在不同环境（客户端、服务器和原生）中运行并且易于测试的应用。可以将 Redux 与 React 或任何其他视图库一起使用。它很小（2kB，包括依赖），但拥有一个庞大的可用插件生态系统。Redux 工具包 是官方推荐的编写 Redux 逻辑的方法。它围绕 Redux 核心，并包含构建 Redux 应用所必需的包和函数。
2026-06-16 10:48:51
33
原创 React十案例下
3、在 Formik 组件中，通过 children 函数属性获取到 errors（错误信息）和 touched（是否访问过，注意：需要给表单元素添加 handleBlur 处理失焦点事件才生效！限制某个页面只能在登陆的情况下访问，但是在React路由中并没有直接提供该该功能，需要手动封装来实现登陆访问控制（类似与Vue路由的导航守卫）。进行项目打包，生成build文件夹（打包好的项目内容），将build目录中的文件内容，部署到都服务器中即可。，策划的功能集适用于中小型部署，不应觉得有义务使用此功能。
2025-04-09 11:52:14
1303
原创 React九案例中
在 Filter 组件的 renderFilterPicker 方法中渲染 FilterMore 组件，从filtersData中，获取数据（roomType，oriented，floor，characteristic），通过props传递给FilterMore组件。在配置路由的时候，多个组件都会被导入到路由中，那么只要组件被导入，那么相关的样式也会被导入进来，如果两个组件的样式名称相同，那么就会影响另外一个组件的样式。默认情况下，只要导入了组件，不管组件有没有显示在页面中，组件的样式就会生效。
2025-04-09 11:47:30
1062
原创 React七Formik
Formik是一个专为React构建的开源表单库。它提供了一个易于使用的API来处理表单状态管理，表单验证以及表单提交。Formik支持React中的所有表单元素和事件，可以很好地与React生态系统中的其他库集成。同时，Formik还提供了一些高级功能，如支持异步验证、字段级别的验证、根据表单状态变化自动计算属性等。
2025-02-25 16:29:27
941
原创 React六官方文档总结三脱围机制
如果可以在渲染期间计算某些内容，则不需要使用 Effect。想要缓存昂贵的计算，请使用 useMemo 而不是 useEffect。想要重置整个组件树的 state，请传入不同的 key。想要在 prop 变化时重置某些特定的 state，请在渲染期间处理。组件 显示 时就需要执行的代码应该放在 Effect 中，否则应该放在事件处理函数中。如果需要更新多个组件的 state，最好在单个事件处理函数中处理。当尝试在不同组件中同步 state 变量时，请考虑状态提升。
2024-10-25 10:31:24
1382
原创 React三原理和路由
造成进入首页时，需要加载的内容过多，时间过长，在浏览器中可能会出现短暂的空白页，从而降低用户体验，而运用路由懒加载是将各个模块分开打包，用户查看的时候再加载对应的模块，减少加载用时。由于 useRoutes 是通过 context 实现的，切换路由时 context 共享出来的 value 值发生了变化，从而使得使用到这个 context 的组件触发了 rerender，这也就造成了使用 useRoutes 的 RouteCom 组件在切换路由时重新渲染了！理想状态是部分更新，只更新变化的地方。
2024-08-01 22:59:55
1204
原创 React二组件进阶
捕获使用组件时因为 props 导致的错误，给出明确的错误提示，增加组件的健壮性。组件的生命周期有助于理解组件的运行方式、完成更复杂的组件功能、分析组件错误原因等。高阶组件内部创建一个类组件，在这个类组件中提供复用的状态逻辑代码，通过prop将复用的状态传递给被包装组件 WrappedComponent。对于组件来说，props 是外来的，无法保证组件使用者传入什么格式的数据。高阶组件（HOC，Higher-Order Component）是一个函数，接收要包装的组件，返回增强后的组件。
2024-07-21 22:36:57
1014
原创 React一基础
React 是一个用于构建用户界面的javaScript库，起源于facebook的内部项目，后续在13年开源了出来。声明式——只需要描述UI看起来是什么样式，就跟写HTML一样，React负责渲染UI基于组件——组件时React最重要的内容，组件表示页面中的部分内容，组合、复用多个组件，可以实现完整的页面功能学习一次，随处使用——使用React可以开发Web应用，使用React可以开发移动端，可以开发VR应用。
2024-07-15 15:00:38
1302
原创 Vue2 基础十Vuex
父组件向子组件传值，是以属性的形式绑定值到子组件（v-bind），然后子组件用属性props接收。子组件向父组件传值，子组件用 $emit() 自定义事件，父组件用v-on监听子组件的事件。兄弟组件的传值，通过事件中心传递数据，提供事件中心，传递数据方通过一个事件触发hub.$emit(方法名，传递的数据)，接收数据方通过在钩子中 触发hub.$on(方法名, 传递的数据)。Vuex是实现组件全局状态（数据）管理的一种机制，可以方便的实现组件之间的数据共享。
2024-07-09 10:42:41
579
原创 SwiftUI九创建watchOS应用
watchOS平台的Landmarks应用已经接近完成了。提示：本节只讲当用户收到通知时怎样显示通知界面，不涉及怎样设置和发送通知给用户的内容。1、添加一个新的自定义视图到 WatchLandmarks Watch App 文件夹 NotificationView.swift，并创建一个视图来显示有关地标、标题和消息的信息。?Divider()?2、添加一个预览，用于设置通知视图的标题、消息和地标属性。这将显示提供数据时通知视图的预览。
2024-07-04 14:26:32
1240
1
原创 Vue2 基础九电商后台管理项目——下
在 vue.config.js 导出的配置对象中，新增 configureWebpack 或 chainWebpack 节点，来自定义 webpack 的打包配置。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。默认情况下，Vue项目的开发模式与发布模式，共用同一个打包的入口文件（即 src/main.js）。至此运行 build 打包，得到的目标文件中确实没有 console 日志输出，但是打包日志中依然有警告，若想消除此条警告可以在。
2024-07-03 14:32:46
860
原创 Vue2 基础八电商后台管理项目——中
5、添加商品，完成添加商品的操作，在添加商品之前，为了避免goods_cat数组转换字符串之后导致级联选择器报错需要打开vue控制条，点击依赖，安装lodash，把addForm进行深拷贝。2、展示信息，展示商品参数信息、商品属性信息，在商品参数信息展示中使用的el-checkbox,el-checkbox-group组件，打开element.js引入组件并注册组件。5、完成添加分类，添加级联菜单显示父级分类。3、添加商品，添加编程式导航，在List.vue中添加编程式导航，并创建添加商品路由组件及规则。
2024-06-28 16:35:21
957
原创 Vue2 基础七电商后台管理项目——上
当在输入框中输入内容并点击搜索之后，会按照搜索关键字搜索，希望能够提供一个X删除搜索关键字并重新获取所有的用户列表数据，只需要给文本框添加clearable属性并添加clear事件，在clear事件中重新请求数据即可。在数据中添加一个iconsObj，然后将图标类名进行数据绑定，绑定iconsObj中的数据。1、显示数据，在data中添加一个rolesList数据，在methods中提供一个getRolesList方法发送请求获取权限列表数据，在created中调用这个方法获取数据。
2024-06-28 16:31:39
1152
原创 SwiftUI八与UIKIT交互
准备为包裹在 UIViewRepresentable 视图中的子视图上添加了一个自定义 UIPageControl。1、创建一个新的 SwiftUI 视图，命名为 PageControl.swift，并使 PageControl 类型遵循 UIViewRepresentable 协议。UIViewRepresentable 和 UIViewControllerRepresentable 类型有相同的生命周期，在 UIKit 类型中都有对应的生命周期方法。
2024-06-28 15:40:25
1690
原创 SwiftUI七使用UI控件
应用在本地存储了一些配置和用户偏好设置。在用户编辑这些数据前，会被展示在一个没有编辑按钮的概要视图上。2、接下来，在Views组下创建一个名为Profiles的新组，然后向该组添加一个名为ProfileHost的视图，该视图带有显示存储的概要文件的用户名的文本视图。ProfileHost视图将承载概要信息的静态摘要视图和编辑模式。3、在Profiles组中创建另一个名为 ProfileSummary 的视图，该视图会持有一个Profile实例，并显示用户的基本信息。
2024-06-11 11:45:07
1266
1
原创 SwiftUI六组合复杂用户界面
应用的首页是一个纵向滚动的地标类别列表，每一个类别内部是一个横向滑动列表。随后将构建应用的页面导航，这个过程中可以学习到如果组合各种视图，并让它们适配不同的设备尺寸和设备方向。下载起步项目并跟着本篇教程一步步实践，或者查看本篇完成状态时的工程代码去学习，。
2024-06-07 11:09:54
1710
原创 SwiftUI五视图动画和转场
使用SwiftUI可以把视图状态的改变转成动画过程，SwiftUI会处理所有复杂的动画细节。在这篇中，会给跟踪用户徒步的图表视图添加动画，使用animation(_:)修改器给一个视图添加动画效果非常容易。下载起步项目并跟着本篇教程一步步实践，或者查看本篇完成状态时的工程代码去学习，。
2024-06-07 10:30:44
1029
原创 SwiftUI四绘制路径和形状
使用六边形的绘制参数数据HexagonParameters，依次绘制六边形的边，形成大致轮廓.addLine(to:)方法会使用当前绘图光标所在点为起点，方法参数中指定的点为终点绘制直线。当绘制区域不是正方形时，使用绘制区域的最小边长(长宽中哪个最小使用哪个)作为绘制徽章背景的边长，并保持徽章背景的长宽比为1:1。定义一个新的类型用于展示旋转一定角度的徽章符号，使用ForEach生成不同旋转角度的山峰符号，绘制在徽章背景上，从而形成最终的徽章。地标徽章中心有一个以地标App图标中的山峰图形改造形成的标志。
2024-06-07 09:49:32
969
原创 SwiftUI三处理用户输入
在Landmark应用中，标记喜爱的地方，过滤地标列表，只显示喜欢的地标。要增加这些特性，首先要在列表上添加一个开关，用来过滤用户喜欢的地标。在地标上添加一个星标按钮，用户可以点击它来标记这个地标为自己喜欢的。在开始之前先新建项目，将之前 Model、View、Resource 目录及其中的文件复制到项目中，并将 SceneDelegate.swift、Assets.xcassets 文件替换为之前的。
2024-06-03 10:00:04
667
原创 SwiftUI二列表和导航
Xcode的画布会自动识别当前代码编辑器中遵循PreviewProvider协议的类型，并将它们渲染并展示在画面上。一个视图预览提供者(preview provider)返回一个或多个视图，这些视图可以配置不同的大小和设备型号。可以定制从preview provider中返回的视图被渲染在何种场景下。2、使用previewLayout(_:)修改器设置一个行视图在列表中显示的尺寸大小。3、把预览的行视图包裹在Group中，把之前的第一个行视图也加进去。Group {
2024-06-03 09:57:35
687
原创 SwiftUI一创建和组合视图
有了地标名称、地标位置及状态视图，下一步再添加一个地标图片视图。这个图片视图将自定义遮罩(mask)、边框(border)和阴影(shadow)新建SwiftUI文件CircleImage用Image替换Text，并使用turtlerock图片初始化Image视图添加clipShape(Circle())修改器到Image，给图片添加圆形剪切效果。Circle是一个形状，它可以被用作遮罩、也可以是圆圈，还可以是圆形填充视图。
2024-06-03 09:54:55
1296
原创 Vue2 基础六前端工程化
/ publicPath: '/', // 启动页地址// outputDir: 'dist', // 打包的目录// lintOnSave: true, // 在保存时校验格式// productionSourceMap: false, // 生产环境是否生成 SourceMaphost: 'localhost', // 主页地址port: 8888, // 端口号open: true, // 自动打开浏览器访问主页// proxy: null, // 设置代理})
2024-05-28 10:52:48
1404
原创 Vue2 基础五路由
其中"用户管理"组件展示的效果如上图所示，在用户管理区域中的详情链接也是可以点击的，点击之后将会显示用户详情信息，并在详情页实现后退功能。）是 Vue.js 官方的路由管理器。路由重定向指的是用户在访问地址 A 的时候，强制用户跳转到地址 C ，从而展示特定的组件页面；1、props的值为布尔类型：props 被设置为 true，route.params 将会被设置为组件属性，使用 props 接收路由参数。前端路由的基本概念：根据不同的事件来显示不同的页面内容，即事件与事件处理函数之间的对应关系。
2024-05-20 08:00:11
1065
原创 Vue2 基础四前后端交互
JavaScript的执行环境是单线程，常见的异步调用：定时任务、ajax、事件函数。多次异步调用的结果顺序不确定，异步调用结果如果存在依赖需要嵌套。Promise 是异步编程的一种解决方案，从语法上讲，Promise是一个对象，从它可以获取异步操作的消息。Restful 形式的 URL HTTP请求方式：GET 查询、POST 添加、PUT 修改、DELETE 删除。接口调用方式：原生ajax、基于jQuery的ajax、fetch、axios。
2024-04-18 11:10:11
1581
原创 Vue2 基础二常用特性
当内置指令不能满足特殊的需求时，Vue允许我们自定义指令。binding 为自定义的函数形参，通过自定义属性传递过来的值存在 binding.value 里面。局部指令，需要定义在 directives 的选项，用法和全局用法一样；局部指令只能在当前组件里面使用；当全局指令和局部指令同名时以局部指令为准。<h2>自定义指令</h2><h3>自定义全局指令</h3><h3>自定义局部指令</h3></div><script>el.focus();});});data: {},
2024-03-08 16:13:02
833
原创 前后端交互—使用自己的服务器开发项目
由于使用VSCode访问开发的项目页面使用的是 file 协议，file 协议在开发当中会有很多的问题，通常需要 http 协议来访问开发的 html 文件，更换裁剪的图片，首先拿到用户选择的文件；然后根据选择的文件，创建一个对应的 URL 地址；中的子页面，如果想要调用父页面中的属性、方法，使用 window.parent 即可（但是必须http协议中打开）。导入 layui 的 js 文件，为需要验证的表单项添加 lay-verify 属性，同时指定具体的校验规则即可。
2024-01-26 16:19:10
967
iOS弹出框总结代码
2016-10-30
CALayer的基本使用demo
2015-12-01
CoreAnimation
2015-12-11
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人