组件设计
本话题发布组件设计相关的问答文章和技术分享，将持续更新，为您推荐了20篇问答，访问即可查看更多精彩内容。
-
1
回答
2浏览
Storybook中如何为组件注入全局Context Provider？
我在用Storybook写一个按钮组件的Story时，发现组件依赖项目里的AuthContext，但Storybook运行时报错找不到Context值。我试过在.stories.jsx里用addDec...
-
1
回答
45浏览
React Strict Mode为什么导致useEffect两次执行？代码没问题却报错
我在React组件里用Strict Mode包裹App时，发现useEffect里的API请求执行了两次，控制台还报错说useState未定义。但移除Strict Mode后就正常了，这是为什么？ 比...
-
1
回答
73浏览
React Native中为什么iOS和Android的Text组件字体大小显示差异这么大？
我在用React Native写跨平台应用时遇到个怪问题，给组件设置了fontSize: 16，iOS上显示正常，但Android看起来明显小了一号。试过在样式里加lineHeight和include...
-
2
回答
18浏览
Vite+React项目中配置别名后无法导入组件，路径报错怎么办？
在用Vite搭建React项目时，我按文档配置了@别名指向src目录，但导入组件时总提示404错误。比如这样写： // vite.config.js import { defineConfig } f...
-
2
回答
22浏览
React Query预加载时为什么会出现重复请求？
我在用React Query做页面预加载时遇到问题，设置了staleTime和keepPreviousData，但每次刷新页面还是会触发两次请求： 我的查询配置是这样的： useQuery(['pos...
-
2
回答
37浏览
React Navigation切换页面后为什么状态没重置？
大家好，我在用React Navigation做页面跳转时发现一个问题： 从首页跳转到详情页再返回后，详情页的输入框内容和选中的选项都没重置。我尝试过在组件卸载时用navigation.replace...
-
1
回答
23浏览
为什么useReducer里的dispatch不更新状态？
在用useReducer处理表单输入时遇到问题，输入框的值没反应。写了个handleChange函数，通过dispatch('UPDATE_FIELD')传递value，但状态一直没变。 试过检查ac...
-
1
回答
13浏览
React Native fetch请求在安卓上总是失败怎么办？
我在安卓真机测试时，用fetch('https://api.example.com/data')请求老是报错“Network request failed”，iOS模拟器却能正常获取数据。已经试过加c...
-
1
回答
18浏览
为什么useEffect里更新状态会无限循环？
我在用useEffect做API请求时，按教程把依赖项设为空数组，但状态更新后页面一直刷新... 比如这样写： useEffect(() => { fetchUsers().then(data ...
-
1
回答
21浏览
React Native中ScrollView的子元素按百分比设置宽度无效怎么办？
在React Native里用ScrollView装了几个卡片组件，给子元素设置了flexBasis: '50%'，但它们还是堆在一起显示。我试过加flexGrow:1和flexShrink:1，也调...
-
1
回答
300浏览
React Native TurboModule无法注册，启动时报undefined is not an object
我在按照官方文档实现一个TurboModule时遇到了问题。按照步骤创建了MyModule.java并注册到ReactPackage，但运行时却报错了： TypeError: undefined is...
-
1
回答
69浏览
React Native TurboModule初始化失败，native模块未注册？
我在用TurboModule写个原生模块时，JS调用时报错说模块未找到。按照官方文档初始化了Java类并加了@ReactModule注解，但应用启动就崩溃了。错误提示是：TurboModuleRegi...
-
1
回答
18浏览
为什么Error Boundary没捕获到setTimeout里的错误？
我在组件里用类组件做Error Boundary包裹了子组件，但子组件useEffect里的setTimeout里抛错后，页面直接崩溃了，componentDidCatch没触发，这是怎么回事？ 代码...
-
2
回答
10浏览
React Native中FlatList滚动到顶部后数据消失怎么办？
在做搜索功能时，用户点击顶部刷新按钮后数据全没了，只留下空白列表... 我用FlatList渲染搜索结果，当调用ref.scrollToOffset({offset:0})滚动到顶部后，列表里的所有数...
-
1
回答
46浏览
React错误边界为什么在函数组件里没生效？
在函数组件里用类组件做错误边界，报错时页面直接崩溃了，没触发fallback UI。之前在类组件里用没问题，这次按文档改成函数组件包裹试试，代码这样写的： class ErrorBoundary ex...
-
2
回答
47浏览
React中useRef获取元素后样式不生效怎么办？
我在用React做卡片折叠效果时遇到问题，通过useRef获取到元素后直接修改style.height属性，样式完全没反应。之前写过类似的原生JS没问题，这次在函数组件里试过useState和useE...
-
1
回答
18浏览
useCallback在函数组件里用不对，为什么子组件一直重新渲染？
我在用React函数组件时，给子组件传了一个用useCallback包裹的回调函数，依赖数组也写对了，但每次父组件状态变化子组件还是重新渲染，这是为什么啊？ 代码大概是这样的： const Paren...
-
2
回答
53浏览
React Native中安装Vector Icons后图标显示空白怎么办？
刚在项目里安装了@expo/vector-icons，按照文档导入了Ionicons，但页面上就是显示空白。按教程做了一切却还是空白，到底是哪里出问题了？ 我执行了npx expo install @...
-
1
回答
61浏览
React Native调用原生模块返回null怎么办？
我在React Native项目里写了个原生模块想获取设备信息，但调用方法总是返回null。按照官方文档写了Java代码并注册了模块，但前端调用的时候就是得不到正确数据... 这是我的React代码片...
-
1
回答
51浏览
React组件测试时为什么mock的API没有被调用？
我在用Jest+React Testing Library测试一个组件时遇到了问题。组件里用useEffect调用了外部API，我按教程写了mock但测试总是失败： // userApi.js exp...
