我使用TypeScript 4和React 17
我在自定义钩子中有以下代码：
const myValue = useMemo((): string[] => {
if (someCondition) {
return (myMap?.field && myMap.field.[subfieldId]) || null
} else {
...
}
}, [myMap.field.[subfieldId]])
ESlint抱怨说，必须将myMap.field.subfieldId移动到变量中才能进行程序检查。
所以我
浏览 3提问于2020-11-18得票数 2
在我的react组件中，我在控制台中遇到了以下问题
index.js:1 Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render. at Id (http://localhost:3000/main.82c936520e7a7
浏览 0提问于2021-09-23得票数 1
我希望在我的移动React Native应用程序上有一个3xN的布局，就像这样： [ ] [ ] [ ]
title1 title2 title3
[ ] [ ] [ ]
title4 title5 title6
[ ] [ ] [ ]
title7 title8 title9
... ... ... 整个布局，在垂直方向上，将在一个ScrollView中，这样即使它加载的项目比一个屏幕所能呈现的项目多，它也可以正确地显示它的整体。
浏览 17提问于2021-04-27得票数 0
回答已采纳
React hooks提供了使用useEffect模拟生命周期方法componentDidUpdate的可能性，而无需依赖：
useEffect(() => {
// componentDidUpdate
});
如何检测某些道具是否要使用react钩子进行更新？
需要在一些更改之前执行一些代码。
浏览 0提问于2020-05-26得票数 0
我有一个10000条记录的json，我需要显示在一个Flatlist.I中，我使用的是一个虚拟化的列表，它正在工作fine.Now，我有一些过滤器，在单击时应该过滤掉json，然后用新的数据重新呈现列表。我只是在过滤掉数据。
const filters = foo1;
const largeList = [{ id:1, foo:'foo1',bar:10 },{id:2, foo:'foo1',bar:20} ...]
const filteredList = largeList.filter(l=>l.foo === filters &&
浏览 5提问于2021-07-05得票数 5
当用户在输入之外单击时，我尝试使用mousedown事件来关闭自动完成。 代码： // listen to mouse clicking outside of autocomplete or input
useEffect(() => {
document.addEventListener("mousedown", handleClickOutsideAutocomplete);
return () => {
document.removeEventListener("mousedown", handleClickOutsideA
浏览 14提问于2020-10-06得票数 1
我留下了下面的代码，我得到了我的数据。在刷新页面时，会处理多个请求，原因可能是，如果您能帮我的忙，我会很感激的。祝您今天愉快。
import React, { useEffect, useState } from "react";
import axios from "axios"
import Cookies from "universal-cookie"
const Entry = React.createContext();
export const EntryProvider = ({ children }) => {
浏览 3提问于2022-08-02得票数 0
我用平板表来显示数据，作为回应，我得到了一些数据。
但是，json响应字符串是以{}大括号开始的，而不是从[]括号开始的。
因此，在错误之下：
不变违规:尝试获取超出范围的索引Nan的帧。
做完日志后，我在我的dataSource of FlatList is [Object Object]中得到了什么
我在postman和它的类似项中检查了json响应：{{[[]}}，简而言之，它不以[]括号开头。
因此，我在这里有点困惑，即FlatList必须有以[]括号开头的dataSource或json响应。
如果没有，那么错误会有什么问题呢？如果是，我如何以所需的格式转换它？
谢谢。
编辑
这样做：
浏览 2提问于2018-08-01得票数 0
回答已采纳
当浏览器调整大小时，我正在切换状态：
const [expanded, setExpanded] = useState(true)
useEffect(() => {
const listener = () => {
if (document.documentElement.clientWidth > 1024) return
setExpanded(false)
}
window.addEventListener('resize', listener)
return () => window.removeEventLis
浏览 0提问于2020-01-19得票数 3
回答已采纳
(我知道有一些站点可以共享本机示例，但我还无法通过google找到它们；"react本机共享代码“只是想出了共享按钮的代码，”例如“-有什么好的站点可以用于此功能？)
我有一个列表(多亏了这个，归功于@colin)。我想做的是在每个列表视图中放置一些项目，并让它们在容器中对齐(一个复选框和一个标签放在同一行中)。但我不能走那么远，因为我搞不懂为什么这20个项目的数组只显示10个项目。
警报显示20项(0-19)当它发射时。
代码：
import React, {Component} from 'react';
import {View, Text, StyleSheet
浏览 3提问于2016-11-20得票数 5
回答已采纳
1回答
我对此反应很新，而且我还停留在如何将api调用的结果传递到另一个组件文件以触发呈现的方法上。有人能给我一个简单的解释，说明我需要满足什么吗？
这是我调用API的代码，然后我需要在和IF语句中使用weatherDescription状态，以便有条件地将本地GLTF文件呈现到画布中。
import { useEffect } from "react";
import { useState } from "react";
import "dotenv";
export default function WeatherLogic() {
const
浏览 2提问于2022-08-31得票数 0
1回答
众所周知，我们在useEffect中放置了一个依赖数组。但是，当我们在svelte中使用相当于onMount的useEffect方法时，它不需要依赖数组。有人能解释一下为什么。
//// React ////
useEffect( ()=>{
// side effects goes here //
},[])
//// Svelte ////
onMount( ()=>{
// side effects goes here //
})
浏览 1提问于2022-09-20得票数 0
当我单击MultipleComponent按钮时，函数中的所有日志都返回null。
第二次单击它时，它返回前面的值。
如何在map函数中获取每个日志中的当前状态？
当我在useEffect钩子中调用函数时，useEffect会在第一个呈现之后运行。我不希望它在第一次渲染之后运行。
import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";
import { observer } from "mobx-react-lite";
func
浏览 2提问于2022-08-01得票数 0
ActionScript移动项目。快闪到IPad。我正在使用4.5.1
我有一排电影，我需要水平拖动。
可能有多达300个剪辑。每个剪辑有100 px宽。
每个剪辑都有不同的内容/文本和动画。
观景区将是舞台。
任何关于.的提示或链接.
拖着。当不在舞台上时，拖动和移除夹子。(我不知道如何删除和放回正确的内容在剪辑中)如何管理内容。优化。
任何想法都将不胜感激！耽误您时间，实在对不起。
浏览 3提问于2011-08-02得票数 0
回答已采纳
3回答
我正在一家公司开发一个react本机应用程序，我的经理问我，从API (仪表板)上传的pexels中的最佳图像大小是什么，以适应应用程序中的视图？
我使用的是百分比单位而不是数字：(宽度：'80%'，高度：'50%')我不知道什么是最适合的图像大小，或者图像和反应的长宽比是不单位的！
当客户端上传任何图片时，我们应该在仪表板中添加什么提示？或者，我如何才能知道适合所有屏幕的最佳图像尺寸？
浏览 6提问于2022-06-29得票数 0
回答已采纳
我正在尝试切换单个按钮，以便它可以使用useState隐藏/显示元素。但这种状态只会改变一次。这是在第一次点击时，状态切换，但不是为了进一步的点击，我不明白为什么我的代码是这样的
const Viewer: React.FC<InputProps> = props => {
const [isToggled, setToggled] = useState(false);
const viewerRef = useRef<HTMLDivElement>(null);
useEffect(() => {
viewer(
浏览 1提问于2021-08-04得票数 0
我正在开发一个应用程序，它的一个部分包含了一个玩家列表。列表中的每一项都包含球员的名字，他/她拥有的积分和一个用来改变积分的IOS stepper。
每次我使用IOS stepper修改玩家的点数时，应用程序的状态都会根据该值进行更改。但是，包含玩家分数的文本不会被修改。render函数被调用，应用程序的状态没有变化，因此文本组件也应该改变。我发现当render函数被调用时，它会“跳过”List组件，所以它不会被渲染，也不会调用renderRow函数。
当我切换到TabBar的第二个选项卡，然后返回到第一个选项卡时，文本只显示当前玩家的分数。在这种情况下，将呈现List组件。
我认为这是一个非
浏览 5提问于2017-07-13得票数 1
1回答
我希望从api中显示nft名称。我可以让他们到控制台日志，但正在努力弄清楚如何在屏幕上显示数据。我尝试过useState，但它最终以无限循环告终。
import React, { useState } from "react";
import { useEthers } from "@usedapp/core";
import { Alchemy, Network } from "alchemy-sdk";
const Account = () => {
const [nftRet, setNft] = useState([
浏览 3提问于2022-11-21得票数 0
我有一个导航栏，其中有不同的链接登录和未登录。我在本地存储中设置了一个名为loggedIn的变量。我的useEffect钩子应该监听本地存储，一旦检测到变量，就更新导航栏链接。我确实看到导航链接发生了变化，但只有在页面刷新之后，这显然是不理想的，也不应该是如何工作的。我是不是做错了什么？
import React, {useState, Fragment, useEffect} from 'react';
import {Link} from 'react-router-dom';
import './Navbar.css';
const Na
浏览 9提问于2021-02-19得票数 0
我正在尝试向我的应用程序添加一个最喜欢的页面，它基本上会列出一些以前插入的数据。我想要从localStorage获取数据。它基本上是有效的，但当我导航到另一个页面并返回时，localStorage再次为空。我希望localStorage中的数据在应用程序刷新时保持不变。 数据将从此处设置为localStorage import React, { useState, createContext, useEffect } from 'react'
export const CombinationContext = createContext();
const Combinati
浏览 133提问于2019-10-15得票数 0
这三种密码有什么区别？
1：
axios.get('https://jsonplaceholder.typicode.com/posts')
.then((res) => {
console.log(res);
})
.catch((err) => {
});
function App() {
return (
<div className="App">
<p>Learn React</p>
</div>
);
}
export
浏览 1提问于2021-12-22得票数 1
回答已采纳
我正在学习Reactive原住民，对于我的第一批应用程序之一，我希望你包括一个背景图像，所以我包括import {ImageBackground} from 'react-native'使用它。
当我试图在代码中使用它时，我的android仿真器启动了以下错误：
不变冲突:元素类型无效:期望字符串(用于内置组件)或类/函数(用于组合组件)，但未定义。您可能忘记从定义在其中的文件中导出组件，或者您可能混淆了默认导入和命名导入。
这是我的全部代码，正如您所看到的，我没有太多的代码，所以我不知道问题在哪里。
import React from 'react'
impo
浏览 4提问于2020-05-04得票数 0
我正在尝试使用Typescript创建一个React功能组件，它将从API获取数据，然后将数据发送到另一个组件，但是，我得到了一个错误：" error : Too loop- renders . React限制呈现的次数，以防止无限循环。“ 请提供任何建议！ useEffect(() => {
await axios.get('https://quote-garden.herokuapp.com/api/v3/quotes/random').then((resp) => {
setQuote1(resp.data.data[
浏览 133提问于2021-10-05得票数 0
回答已采纳
我使用的是React Native，它附带了支持的React 16 alpha版本。在浏览器和访问DOM时，我们可以使用id或类从组件/文件层次结构中的任何位置访问元素，如下所示：
const modalRoot = document.getElementById('modal-root');
并将其传递给createPortal(child, container)容器arg。而不是容器应该是DOM元素：
第二个参数(容器)是一个DOM元素。
这个函数也是ReactDOM的一种方法，它在React本机中不存在。
是否有办法在中实现类似的功能？
用例：
我想在我的应用程序
浏览 5提问于2017-09-30得票数 19
1回答
我想显示一个逗号分隔的名字的列表，这些名字来自我的react组件中的一个数组。呈现的html如下所示：
<div>
<span>Liza</span>, <span>Eric</span>, <span>Michael</span>, <span>Natalie</span>, <span>Stephan</span>
<a href="#" className="show-more hidden">and {remai
浏览 0提问于2016-08-25得票数 2
回答已采纳
有多少生命周期方法可以被React useEffect替换？
我找到了一篇关于useEffect钩子的文章，声称它只能替换三个，即componentDidMount、componentDidUpdate和componentWillUnmount。
其他人呢？
浏览 4提问于2020-01-15得票数 0
回答已采纳
我试图将两组状态从一个组件传递到另一个组件，这样我就可以在React的标题中列出用户的公司和名称。我知道我得到了正确的信息，因为我在控制台上记录了这两个变量，然后将它们设置为我的状态，然而，当我尝试在导航栏中呈现它们时，我得到了未知的定义。
这是我的Header组件：
import React, { useState } from 'react';
import { Route } from 'react-router-dom';
import { LinkContainer } from 'react-router-bootstrap';
im
浏览 5提问于2021-01-26得票数 0
添加基于在useEffect挂钩之外不断更新的状态或值进行条件呈现的代码是一个问题/坏习惯吗？
像这样
function Home() {
const { state } = useLocation();
const [validation, setValidation] = useState();
const [MainData, setMainData] = useState();
if(true)
do somthing....
else
do somthing....
React.useEffect(() => {
so
浏览 5提问于2022-06-05得票数 0
我正在使用ReactJS和谷歌FireStore创建一个简单的股票投资组合跟踪应用程序。如何在不触发警告"React Hook has a missing dependency“的情况下从useEffect中访问数据库函数？我尝试过使用useCallback，但到目前为止还没有成功。或者可以忽略这些警告？
var db = firebase.firestore();
useEffect(() => {
//get user's cost averages from db
if (props.userStatus) {
db.collect
浏览 4提问于2021-10-23得票数 1
如何在react本机平面列表中呈现数据，将其作为第一项显示，以单行2列中的全部宽度和其余元素作为第一项。
Item 1
Item 2 item3
Item4 item5
Item6 item7 and so on
浏览 3提问于2019-04-26得票数 0
2回答
我正在开发一个应用程序，允许用户搜索书籍，然后将其显示在搜索结果中。为了显示结果，我使用了一个包含3列的FlatList，并显示了书的封面和一些有关这本书的基本信息。
我将API响应的结果存储在状态中，而不使用comoponent。随着更多的结果被添加，内存消耗增加，但是数据是JSON格式的，没有图像存储在状态。
我尝试过，使用removeClippedSubviews和其他几个允许设置窗口大小的选项，但这在内存使用上几乎没有区别。
我是不是漏掉了什么东西，还是有办法优化它？示例代码已上载到此。
下面是我使用的代码片段：
/**
* Sample React Native App
* ht
浏览 7提问于2022-02-08得票数 0
我有一个场景，我的React组件在Desktop和Tablet中呈现相同的UI，但在Mobile中呈现不同的UI。
下面是我用来确定桌面和移动设备的方法。我如何确定并包含平板电脑？
const isMobile = (userAgent = navigator.userAgent) => /Mobi/.test(userAgent);
export const Mobile = ({ children }) => (isMobile() ? children : null);
export const Desktop = ({ children }) => (isMobil
浏览 1提问于2018-04-16得票数 1
我尝试过平板列表，但它在android中有一些性能问题。
当我向下滚动时，它会加载列表。但之后，它显示为空白，而向上滚动。
到达屏幕末尾后，它会停止一段时间，然后加载数据。为什么它没有在底部显示加载程序(活动指示符)？为什么onEndReached和onEndReachedThreshold不能工作？
请看一下视频
我的代码：
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
FlatList,
Activity
浏览 3提问于2017-05-28得票数 5
回答已采纳
1回答
我需要在React中实现一种Web应用程序的主/详细视图。由于应用程序应该集成到CakePHP应用程序中，所以我不能使用React Router来处理路由(因为CakePHP会处理它们)。 我有一个项目列表，并希望在它们之间导航，显示一个详细视图。项目是嵌套的，因此有SubItems可供导航。 ? 现在，我得到了一个ItemList组件，它显示了一个带有点击处理程序的卡片列表。如何在不更改url的情况下更改视图？ ItemList组件如下所示： class ItemList extends React.Component {
constructor(props) {
浏览 9提问于2021-01-15得票数 0
2回答
我在react应用程序中使用了material UI按钮。当我改变状态时，按钮不会消失。下面是我的代码： function MainPage() {
const state = useSelector(state => state.loginDetails.state)
const [visibilitySetting, setVisibility] = useState(true)
useEffect(() => {
console.log(state.loginType)
if(state.loginType=="g
浏览 23提问于2021-07-13得票数 0
回答已采纳
3回答
这是我从另一个文件导入的函数。
import { useMemo } from 'react'
import { useIntl } from 'react-intl'
export function useRenderStatus(param) {
const { messages } = useIntl()
const data = useMemo(() => {
if (param === 'ACTIVE') return messages.page.active
if (param === 'INA
浏览 6提问于2022-02-02得票数 1
**有人能帮我解释一下为什么我的项目在这方面经常出错吗？我没看到任何关于我的密码的问题。
以下是错误：
警告:超过最大更新深度。当组件在useEffect中调用useEffect时可能会发生这种情况，但是useEffect要么没有依赖数组，要么在每次呈现时都会更改依赖项之一。在O ()在div ()在div ( div )在O ()在div ()在产品()在O ()处产品在div()在div ()在ProductList at RenderedRoute ()在路由器()处()在BrowserRouter ()
以下是相关代码: App.jsx。这一条是为路线设置路径。
import R
浏览 13提问于2022-10-02得票数 1
回答已采纳
1回答
我试图使用列表类别帖子插件，以便我可以有不同类别的文章显示在不同页面的底部。我似乎无法让thumbnails=yes选项发挥作用。它确实显示图像，但不显示缩略图大小。
有没有人用这个，知道这个问题的答案？
谢谢Betsy S. Franz www.hbca-brevard.org
浏览 0提问于2011-09-14得票数 1
我已经创建了cardView，但是如何将它转换为<FlatList/>，我无法理解什么是renderItem of FlatList？
我现在的代码是：
<ScrollView style={styles.container}>
<View style={styles.cardView}>
<Text style={styles.projectName}>{marketing_updates.length != 0 ? marketing_updates[0].project
浏览 1提问于2018-10-01得票数 1
回答已采纳
我目前正在用React Native开发一个应用程序，但它的运行速度非常慢。该应用程序显示了大约每100ms更改一次的大约15个数字的列表。问题是JS线程以20-30fps的速度工作，这会减慢应用程序的其余部分。
我在一个沙箱项目中重现了这个问题，同样的事情也发生了。
import React, { useState, useRef, useEffect } from 'react';
import {
View,
Text,
} from 'react-native';
const useInterval = (callback, delay) =
浏览 0提问于2020-01-25得票数 1
1回答
我有一个下拉组件，其中重要的部分是：
import { useEffect, useState } from "react"
type PropsType = {
options?: any[]
}
export const DropDown = (props: PropsType) => {
const { options = [] } = props;
const [query, setQuery] = useState('');
const [filteredOptions, setFilteredOptio
浏览 4提问于2022-10-17得票数 0
1回答
我使用useEffect监听location.pathname中的更改，以便在路由更改时自动回滚到页面(路由器)的顶部。因为我有一个页面转换(需要pageTransitionTime * 1000秒)，所以我使用一个计时器来等待页面转换动画在重置发生之前发生。但是，在路由器的第一次加载/挂载(在加载页之后)，我不希望等待动画，因为没有页面动画。
注意下面的代码，它的工作原理与预期完全一致：
useEffect(() => {
const timer = setTimeout(() => {
window.scrollTo(0,0)
}, firstV
浏览 6提问于2022-10-16得票数 1
假设您有一个已定义的函数，其中包含一个未由事件触发的react组件中的this.setState。
如何才能进行preventDefault()以保持当前滚动页上？
我创建了一个沙箱来说明这种行为：
当定义组并启动呈现器时，页面在顶部滚动。这不发生，id组未定义或包含空数组.
我怎样才能防止这种滚动
浏览 3提问于2019-11-26得票数 0
回答已采纳
1回答
我的的eslinter似乎没有发现VSCode中的特定反应错误。例如，，如果我忽略了useEffect中所需的依赖项，链接器就不会捕捉到它。
注意:使用app，linter按预期工作。
是否可以用反应本地人来做？这就是我所拥有的：
// package.json
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/runtime": "^7.12.5",
"@react-native-community/eslint-con
浏览 4提问于2022-03-24得票数 0
我正在使用redux工具箱方法中的api获取数据。我正在控制台中获取数据，但是我的钩子在页面加载时没有更新。
在这里输入代码
import { widthPercentageToDP as wp, heightPercentageToDP as hp } from 'react-native-responsive-screen';
import { useNavigation } from '@react-navigation/native';
import { Calendar } from 'react-native-calendars';
浏览 1提问于2022-11-17得票数 0
我们有一个使用JavaScript开发的react native项目，现在我们决定也有它的网站。我们发现Microsoft引入了ReactXP，而且它也能够发布网站。可以将当前的react原生项目转换为reactXP吗？
浏览 3提问于2018-01-24得票数 1
import React from 'react'
import axios from "axios"
import { useEffect } from "react"
import { useState } from "react"
export function Profile (){
const pathname = window.location.pathname
const[data,setData] = useState([])
const [loaded,hasloaded] = useS
浏览 6提问于2022-03-24得票数 0
我想把我的按钮放在屏幕的左下角。我尝试过使用bottom: 0和left: 0，但这并没有起到任何作用。我研究了一下，发现我需要设置position: 'absolute'。然而，当我这样做，我的按钮完全消失。
如何通过屏幕左下角的按钮定位？
这是我的代码：
import React, { Component } from 'react';
import { Button,Alert, TouchableOpacity,Image } from 'react-native'
import {
AppRegistry,
Style
浏览 3提问于2017-10-14得票数 0
回答已采纳
我正在使用react和redux创建这个UI。下面是UI的图像。
现在，当单击“类别”时，它将显示数据。然后，当我点击未映射的链接时，它会显示“类别”的未映射产品。但当我点击‘加载项’，然后在未映射的链接，它仍然显示‘类别’的未映射产品。我如何写还原器，以便它显示‘加载项’的未映射产品以及。在我使用的react文件(this.props.menu_items)中，这就是为什么当单击“类别”时，显示在加载项后未映射的数据的原因。
这是我的还原机档案。
import { AppConstants } from '../constants';
const initialState
浏览 3提问于2017-07-21得票数 0
回答已采纳
这是一个常见的问题，但不知怎的，我已经尝试了我能找到的所有解决方案，但仍然收到了这个警告。
VirtualizedList: You have a large list that is slow to update - make sure your renderItem
function renders components that follow React performance best practices like
PureComponent, shouldComponentUpdate, etc. {"contentLength": 5200, "dt&#
浏览 20提问于2022-09-23得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
