我有一些代码：https://codesandbox.io/s/d3-server-side-rendering-xpjhl import React from "react";
import ReactDOMServer from "react-dom/server";
import { select } from "d3";
const D3Example = () => {
const data = [25, 30, 45, 60, 20];
const svgRef = React.useRef(null);
Rea
浏览 25提问于2020-03-27得票数 1
我想做的是有一个下面有一组控件的视频。有很多地方我需要这些控件，所以我决定使用React来渲染它们，这样它们就可以很容易地重用。
下面是我的代码：
import React from 'react';
import ReactDOM from 'react-dom';
import './styles.css';
class VideoControls extends React.Component {
render() {
return(
<div>TESTING</div>
);
浏览 0提问于2018-11-04得票数 0
我收到了这样的警告："React React.useEffect有缺失的依赖项：'fetchData‘和'source’。要么包含它们，要么删除依赖数组react/dependencies“。这是我的职责：
function EmployeesPage(props: any) {
const companyId = props.match.params.id;
const source = axios.CancelToken.source();
const fetchData = async () => {
try {
浏览 3提问于2021-03-12得票数 0
回答已采纳
当前行为： 如果在浏览器上有条件地应用了样式，则来自服务器的样式不会更改，即使组件运行并正确传递了浏览器属性也是如此。从服务器发回的html停留在页面上，即使在传递了新的基于浏览器的道具的客户机上第一次呈现之后，组件仍继续显示服务器样式。这是在nextjs应用程序中，使用情感11 我觉得这必须在某个地方涵盖，但我梳理了一整天，这些问题，以及nextjs问题，没有找到任何确切的问题描述或修复它。 要重现:显示组件的Codesandbox在服务器上有一组样式，然后当在浏览器上时，应该切换到不同的样式集 https://codesandbox.io/s/cool-worker-meil8?file
浏览 17提问于2021-09-03得票数 0
1回答
我想在react中画饼图。当滑块范围改变时，饼图应根据范围滑块的值而改变。我们不能在赋值中使用状态。问题是我是react的新手，不知道如何在不使用state的情况下改变父属性值的子属性(在我的例子中是笔划-dasharray)，这应该反映在饼图上。 任何人请帮帮我。我的整个代码如下所示。 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Raect Aiignment -
浏览 21提问于2019-02-15得票数 0
我在学反应。我想在另一个组件中使用一个组件。我看了，，和其他来源，试图应用解决方案，但他们没有帮助我.
我的list.html包含：
<body>
...
<div id="filtered_list"></div>
<script src="built/test.js"></script>
<script src="built/filteredList.js"></script>
</body>
test.js
'use strict'
浏览 1提问于2018-02-21得票数 0
回答已采纳
我是编程新手，正在学习Facebook的react.js。我找到一个网站，里面有一个使用react构建“购物车”的教程。我试图修改它以使用for循环添加更多的项，但它总是给我“意外的token }”错误，然后是这个错误：
“不变冲突: FluxProduct.render()：必须返回有效的ReactComponent。您可能返回了未定义的、数组或其他无效对象。”
我意识到有一个类似的问题得到了回答，但它对我没有帮助。
这个项目中有相当多的代码，但我遇到麻烦的地方看起来像这样：
render: function() {
var rows = [];
var ats = (thi
浏览 1提问于2015-03-19得票数 1
2回答
我做了关于的注释教程，并让它使用.net mvc呈现服务器端。
我有一个现有的mvc应用程序，我重写了一个页面的反应。我试图使用.net来呈现服务器端，但是当它试图呈现服务器端时会出现错误。
Exception Details: React.Exceptions.ReactServerRenderingException: Error while rendering "TopicAnswers" to "react1": TypeError: undefined is not a function
at React.createClass.render (
浏览 2提问于2015-05-24得票数 1
回答已采纳
我想要创建一个使用字符串的组件列表。在Google/StackOverflow上搜索，这似乎很容易：
import Light from 'light.jsx';
[...]
getComponent()
{
let DynamicComponent = "Light";
return <DynamicComponent />;
}
不幸的是，这种方法行不通。我得到这个错误，非控制台：
警告:正在使用大写HTML。始终在React中使用小写HTML标记。警告:该标签在此浏览器中无法识别。如果您打算呈现一个React组件，请用大写字母开头
浏览 1提问于2018-02-20得票数 1
我在调试生成React组件的代码时遇到了困难。我一直得到一个TypeError: cyclic对象。我已经在线阅读了解决方案(，)，但在我的代码中仍然没有显示。
如下所示：
'use strict'
/**
* The form input radio button for generating HTML Radio button and Radio button groups
*/
import React from 'react'
import AbstractFormField from './AbstractFormField.js
浏览 1提问于2016-12-23得票数 0
1回答
我试图设计的API：
<Carousel>
<CarouselItem><any arbitrary HTML here></CarouselItem>
<CarouselItem><any arbitrary HTML here></CarouselItem>
<CarouselItem><any arbitrary HTML here></CarouselItem>
</Carousel>
每个<CarouselItem/>都应该有一
浏览 1提问于2016-08-20得票数 0
回答已采纳
我有一个带有项目列表的视图。当我单击其中一个项目时，我想让面板显示所单击项目的所有详细信息。 这是我写的上下文文件 import React, { useContext, useState } from 'react';
const ActivityPreviewContext = React.createContext();
const ActivityPreviewUpdateContext = React.createContext();
export function useActivityPreview() {
return useContext(Act
浏览 24提问于2021-01-29得票数 0
回答已采纳
var PersistanceLayout = React.createClass({
render : function(){
var jsondata = {// nested json data};
return (<div><table border="true">
<TableRow fullData={jsondata}/>
</table></div>);
}
});
var TableRow = React.createClass({
rend
浏览 2提问于2016-11-29得票数 0
1回答
问题我得到了一个大的嵌套数组，它有几个嵌套的子层。我从API中得到的对象是平面的，基于ParentId，我可以知道父对象。
在我的HTML中，我想循环遍历每个对象并向它显示子对象。
有没有人有一种奇怪的方式来编写createSelector，并在HTML的每个循环阶段选择一个状态，这样，为什么我更新嵌套的子程序，它就不会重新呈现整个HTML，而只是重新呈现被更新的对象。
我看过角质材料表的方法，试着看看其他人是否有这样的概念或方法。
应用程序信息：
框架:角5万向盘
状态mgmt: Ngrx
后端: Node + swagger
我的API调用返回一个具有对象类型的大型数组
浏览 1提问于2017-12-20得票数 1
回答已采纳
我理解，useEffect需要依赖项数组中的依赖项，但是当我将其与useState结合时，将有一个无限循环：
const [valid, setValid] = useState(false);
useEffect(() => {
setValid(true);
}, [valid]};
这就是为什么我用它就像：
useEffect(() => {
setValid(true);
}, []};
因此，我得到：
React Hook useEffect has a missing dependency: 'setValid'.
我怎么才能摆脱警告呢？
浏览 4提问于2021-03-14得票数 0
回答已采纳
1回答
我一直试图使用react上下文更新应用程序上几个屏幕使用的全局状态，这似乎是我找到的建议。
然而，每次在屏幕中更新上下文时，它都会再次卸载和挂载。我怎么才能防止这件事？
。如果单击该按钮，您将从我的useEffect中看到一个新的控制台日志。
代码如下：
import React, {
useContext,
useState,
useEffect,
createContext,
Dispatch,
SetStateAction
} from "react";
import { Button } from "react-native";
浏览 4提问于2022-04-03得票数 0
回答已采纳
回答了，展示了如何使用Reactjs在Google Map上放置标记。
我想使用一个数组来拉入多个地图标记，并且我想要"marker“变量：
var marker = new google.maps.Marker({position: this.mapCenterLatLng(), title: 'Hi', map: map});
成为一个React组件，这样我就可以设置一个密钥，并充分利用React的diff algo的全部性能。
这是我的尝试，它不起作用：
/** @jsx React.DOM */
var ExampleMarker = React.create
浏览 4提问于2015-02-12得票数 1
2回答
我正在学习React，并通过返回必要的JSX来构建html表(数据有100+对象条目)的代码片段。
对于上下文，数据也是一个对象数组：[{},{},{}]
const [trafficData, setTrafficData] = useState();
getTrafficDetails().then(r => {
setTrafficData(r);
})
<TrafficWidget data={trafficData} />
消费于：
const TrafficWidget = ({ data }) => {
let [trafficStatus
浏览 5提问于2020-06-05得票数 0
回答已采纳
我正在使用Firebase auth在一个反应应用程序。我得到的错误如下：
Uncaught : Firebase:名为“DEFAULT”的防火墙应用程序已经存在( App /复制-app)。
我正在尝试配置和初始化一个Firebase应用程序来使用Firebase。使用React类库组件没有任何错误，但是转移到React是一个挑战。
一个简单的例子说明了这个问题发生在哪里：
import React, {useState, useEffect} from 'react';
import './App.css';
import * as firebas
浏览 0提问于2019-09-05得票数 1
回答已采纳
1回答
我有一个SideBar组件，它有一个名为SideBarLink的子组件，它指向正确的页面。 我正在尝试添加搜索功能到我的侧边栏与文本字段。 我已经向SideBar组件添加了一个文本输入，并且我正在尝试根据搜索文本与SideBarLink的文本属性之间的匹配来找出隐藏SideBarLink组件的最佳方法。 这是我目前对侧边栏的设计，但在我们已经知道文本属性的情况下(特别是当我开始添加更多的链接时)，在每个SideBarLink上声明隐藏的事件感觉很难看。 import "./SideBar.css";
import React, { useState } from "r
浏览 10提问于2021-08-19得票数 1
回答已采纳
尝试在React项目中使用web pack在dev中运行webpack-dev- PDFtron来设置服务器，尝试了几个位置，仍然无法加载查看器，我尝试将包含UI和核心的公共文件夹复制到我的dist目录中，仍然无法加载查看器，我还需要在index.html中引用webviewer.min.js吗 我见过的所有示例都使用了react-create应用程序，它会运行react-scripts start，并假定您有一个公共目录。 这是我的WebViewer初始化代码，我已经将公共目录复制到了dist目录中 useEffect(() => {
WebViewer({
浏览 23提问于2021-08-26得票数 0
1回答
我只是尝试了反应功能组件，它似乎是通过魔术工作的。在组件函数中，我初始化我的状态并返回我的视图。视图中的操作可以调用组件函数范围内定义的函数，然后组件函数更新状态。
我的假设是，功能组件的函数只调用一次，但每次发生状态更改时都会被调用，这让我感到惊讶。如果该函数初始化状态，并且在每次状态更改时调用它，那么在每次状态更改时，如何不重置我的状态？
下面是一个键盘记录器组件，它从输入中获取键笔画并将它们显示在div中：
export const KeyLogger = () => {
const [keysLogged, setKeysLogged] = React.useState&
浏览 6提问于2020-09-29得票数 1
回答已采纳
我不希望在输入字段中有所选选项的标签:它可能可以在renderInput属性中寻址，但我不知道如何处理。我知道有limitTags属性，但当它被选中时，选项仍然会显示在输入字段中。下面是一个示例代码： 有什么建议吗？ import React from 'react';
import Checkbox from '@material-ui/core/Checkbox';
import TextField from '@material-ui/core/TextField';
import Autocomplete from '@mate
浏览 35提问于2020-10-15得票数 0
回答已采纳
1回答
我知道新规定。但我还是不明白。请帮助我重写代码，以便没有错误‘匹配的叶路径的位置"/“没有一个元素。”
import React from "react";
import { Route, Routes } from "react-router-dom";
import CartPage from "./CartPage/CartPage";
import ProductList from "./Products/ProducList";
const Main = ({ cartDataProops }) => {
浏览 3提问于2022-05-29得票数 0
回答已采纳
我有一个简单的React.js应用程序，试图在回调的门户中呈现内容，有人知道为什么它没有呈现任何内容吗？
import React from 'react'
import ReactDOM from 'react-dom'
import './App.css';
function App() {
const showElement = React.useCallback(() => {
const element = document.createElement('div');
document.qu
浏览 9提问于2022-01-11得票数 2
回答已采纳
2回答
我正在开发一个reactjs web应用程序。
这是我的代码源代码：
import React, { useContext, useState, useEffect } from "react";
...
function myPage() {
async function myPageLoad() {
...
}
useEffect(() => { myPageLoad(); }, []);
return (<div>My page content</div>);
}
export de
浏览 2提问于2021-04-18得票数 1
回答已采纳
我有一个表单组件，在其中我为它提供了一个验证函数。当我在FC中定义验证函数时，它可以工作。但是当我在FC之外提取这个函数时，它不会被调用。
这样做是可行的：
import { FC } from 'react';
import { Form } from 'react-final-form';
const MyComponent: FC = () => {
const validate = (values: ValidationValues) => { ... }
return (
<Form
onSubmit={
浏览 1提问于2019-11-28得票数 2
回答已采纳
1回答
我正在使用React的State在一个功能组件中从数据库中获取治疗师。从这里我看到，在setTherapists(therapists.concat(therapists));所在的useEffect()中，列表是在无限递归中调用的。我看不出问题出在哪里，也看不出我需要怎么打电话给名单。
当我得到正确的治疗师数组后，我需要渲染所有的治疗师。我就是这么想的，但我不知道怎么用Hooks State来写：
function renderTherapists() {
const items = this.state.therapists.map( (t, idx) => (
浏览 1提问于2020-02-14得票数 0
我使用属性传递组件依赖项。在进行服务器端呈现时，这一点特别重要，因为代码依赖于运行时库(如jQuery或SignalR )。在我的例子中，我需要呈现我的组件服务器端，然后让JS连接到它，并在浏览器中流实时数据。因此，我不需要SignalR服务器端，但是我需要使用React.NET在客户机上传递对web套接字中心的引用。
@Html.React("Comments", new
{
data = Model,
conn = "$.hubConnection()" //<--- I need this to be a literal not a
浏览 5提问于2015-02-13得票数 0
回答已采纳
我正在用酶开玩笑，并试图打印出wrapper.debug，但我没有得到输出，如开玩笑的文档。这里怎么了？我的测试文件：
import React from 'react';
import Enzyme, {shallow} from 'enzyme';
import EnzymeAdapter from 'enzyme-adapter-react-16';
import App from './../../components/App/App';
Enzyme.configure({ adapter : new Enzy
浏览 2提问于2019-01-18得票数 9
如何在react应用程序中使用html元素将JSON转换为普通的html？
请注意，如果您不知道正在注入的HTML中有什么内容，则可能是危险的。
根据反应医生-
dangerouslySetInnerHTML是React在浏览器DOM中使用innerHTML的替代品。通常，从代码中设置HTML是有风险的，因为很容易无意中将用户暴露在跨站点脚本(XSS)攻击之下。因此，您可以直接从React设置HTML，但是您必须键入dangerouslySetInnerHTML并传递一个带有__html键的对象，以提醒自己这是危险的。
我在下面创建了一个代码沙箱：
输出只是呈现为字符串，而不是html
浏览 2提问于2020-10-15得票数 1
回答已采纳
我在前端使用，我得到了这个错误：
index.js:1 Warning: Cannot update during an existing state transition (such as within `render`). Render methods should be a pure function of props and state.
in Login (created by Context.Consumer)
in Route (at App.js:46)
in AuthContextProvider (at App.js:37)
in Swi
浏览 6提问于2020-10-11得票数 11
回答已采纳
1回答
寻求建议:最大更新深度超过的原因
、、、、
我是第一次接触React和GraphQL。尝试使用GraphQL订阅源更新React状态，但生成更新深度错误。
以下是简化的代码：
import { Subscription } from 'react-apollo';
...
function Comp() {
const [test, setTest] = useState([]);
const Sub = function() {
return (
<Subscription subscription={someStatement}>
{
r
浏览 0提问于2020-02-24得票数 0
1回答
我使用React 来显示动态旋转木马。
当我放置static html it displays the data properly in carousel时，但是当我试图显示dynamic data (使用axios)时，则是carousel is always blank。
注意事项：：我使用axios获取数据并更新用于循环数据的状态。
有人能解释一下我在这里犯了什么错误吗?因为旋转木马始终是空白的。
所有代码都在同一个文件中：
我的代码：
import React, { Component } from 'react';
import HeaderComponent fro
浏览 1提问于2019-06-26得票数 1
回答已采纳
在我的主类(游戏循环)中，我创建了几个对象纹理：
//main game class
SDL_Texture* objectTexture;
SDL_Texture* objectTexture2;
如果我在主类(游戏循环)中这样做，纹理不会破坏自己，它会将动画SDL_Rect的一部分留在屏幕上。这是用户单击菜单时的结果。
gameObject = mob.PickUp(scene,x, y,gd, gy,mInteraction,spriteTexture,objectTexture,objectTexture2,renderer,spriteDown1, "
浏览 0提问于2020-05-04得票数 -1
我试图使用redux在redux组件中显示一个帖子列表，但我得到了以下警告：
警告:失败的propType:必需的posts没有在Posts中指定。检查PostsContainer的呈现方法。
我有以下代码：
邮政集装箱：
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { getInitalPosts } from 'actions/postsActions'
import { Link } from
浏览 3提问于2016-06-16得票数 1
回答已采纳
1回答
我有这个App React组件(TypeScript)：
class App extends React.Component {
public state = {
text: ''
}
constructor(props: any) {
super(props);
this.state = { text: 'something' };
}
public handleClick = () => {
const date = `new ! : ${new Date().toString()}`;
// tslin
浏览 0提问于2018-12-27得票数 1
这是用例。我们各自的AJAX调用都在钩子后面(我们使用阿波罗钩子)。然而，有时我们需要进行一个可变数量的调用(一个变量for-循环)。初始AJAX调用确定要对另一个端点进行多少变量调用。不幸的是，这段代码没有运行(响应运行时错误)：
我看过另一个问题，但给出的方法不起作用：
有办法让这件事成功吗？
function useInitialAjaxCall() {
const [result, setResult] = React.useState(0);
React.useEffect(() => {
const resultSize = Math.floor((Ma
浏览 0提问于2019-08-11得票数 0
我对Reactjs非常陌生。我正在练习将值从子组件传递给父组件。实际问题是--将值从select HTML标记传递给父组件。我可以使用回调函数传递select标记的值，并将该值保存在状态变量中。但是，在打印状态变量时，总是给出以前的值，而不是更新的值。
下面是代码-子组件
import React from 'react'
function child(props) {
const handleChange = (e) => {
props.value(e.currentTarget.value);
}
return (
浏览 5提问于2021-08-31得票数 0
1回答
目前，我正在尝试使用组件内部的一个模式来更新组件状态。我能让模态打开，我可以填写输入值。一旦我点击添加按钮，我希望状态被更新，模式关闭。这将导致在主Exercise组件中显示新的数据。
但是，当我尝试添加新行时，进程挂在addWorkoutRow方法中，不提供任何错误。按钮将更改为Add Workout，但模式不会关闭，状态也不会更新。
我试图在没有运气的情况下使用setState回调。我非常肯定，在设置const newRow和调用setModalVisible函数之间，我的错误还不够远，无法看到它。
import React, {Component} from 'react'
浏览 1提问于2018-10-06得票数 2
回答已采纳
我的React组件需要一个ajax调用才能使数据呈现出来。
最初，我使用这种方法在render中启动了ajax调用。这是我的伪代码..。
export class MyView extends React.Component<any, any> {
hasAjaxData: boolean = false;
renderAndGetData() {
const data = {
};
AjaxCall(data)
.then((results) => {
浏览 5提问于2017-04-26得票数 1
3回答
我试图确定在React中使用条件呈现隐藏信息的安全性。
在下面的响应代码中，如果用户未登录，我将隐藏"nnn“信息。
import './App.scss';
const loggedIn = false;
function App() {
return (
<div className="App">
<h1>Website</h1>
<hr />
{loggedIn && (
浏览 13提问于2022-03-13得票数 2
2回答
如本例所示：我正在尝试打印开关的开/关状态，如下所示：
import React, { useState } from "react";
import { View, Switch, StyleSheet, Text } from "react-native";
const App = () => {
const [isEnabled, setIsEnabled] = useState(false);
const toggleSwitch = () => setIsEnabled(previousState => !previousS
浏览 0提问于2020-10-01得票数 3
我有以下代码。它使用的是较旧版本的React，但是为什么redux存储状态!!this.state.checked在render()中显示为false ...尽管defaultState是true index.js import ReactDOM from 'react-dom';
import React from 'react';
import { createStore } from 'redux';
const defaultState = { checked: true };
const reducer = (state = d
浏览 16提问于2020-11-05得票数 0
回答已采纳
我使用的是ReactJS，我有一个用ul li制作的项目的简单列表。我在这里尝试实现延迟加载特性，但是我仍然坚持React不提供任何append方法的事实。因此，一旦向下滚动，我就无法将列表中的新项添加到现有的项目中。我不想重新呈现整个列表与新的一组项目包括。请帮帮忙。
浏览 3提问于2014-11-11得票数 2
回答已采纳
1回答
导航栏功能？
、、、、
请帮帮忙。我正在尝试添加功能到我的导航栏，以便当我点击菜单按钮时，会弹出一个侧面导航栏。它不起作用。我在网上进行了广泛的搜索。signedInLinks是一个脚本，其中包含在有人登录时使用的链接。布尔型true是一个占位符，稍后将包含auth.uid，用于检查人员是否已登录(如果您想在这方面帮助我，也请帮助我-当我使用this.state.links时，它会抛出一个错误。如何让我的程序显示一个有功能(弹出菜单等)的导航栏？
import React, { Component } from 'react';
import { Link } from 'react-rout
浏览 13提问于2020-02-19得票数 0
在我的react应用程序中，我有一个约简函数，它负责循环一个由4个字符串组成的数组，并返回包含所有这些项的字符串。是否有理由用useMemo钩子包装函数，或者在这种情况下它是多余的？
浏览 3提问于2022-10-05得票数 -1
我对ReactJS相对比较陌生，并且已经被实现服务器端渲染以减少“第一条推文的时间”的简单性所吸引。我正在运行一个Node-Express-React堆栈，它使用React的renderComponentToString在服务器上预先呈现标记。
当组件可以同步呈现时，它可以工作得很好，但是当涉及到实现ajax填充的组件时，我会遇到困难(然而，这适用于组件初始化期间的任何异步操作，例如websocket)。
以React网站上的例子为例：
componentDidMount: function() {
$.get(this.props.source, function(result) {
浏览 1提问于2013-12-28得票数 19
1回答
我有一个组件，我列出了所有类别的新闻。Links在另一个组件中，但仍然在路由器中。因此，当我更改链接时，它会改变，但内容不会改变。我认为这是因为我的NewsFeed组件(我用所有路由定义了Switch )没有被更新。
它只有当我手动刷新页面时，链接被更改。
我将NewsFeed组件封装为临时的withRouter组件，这样它就可以知道路由器中的所有变化。它确实开始知道这些变化，但内容并没有改变：
NewFeed
import React from 'react';
import { Route, Switch, withRouter } from 'react-rout
浏览 1提问于2020-07-08得票数 0
回答已采纳
我最近开始学习React / Redux，现在我正在尝试构建一个小的单页应用程序。
最近我遇到了一个我不明白也无法解决的问题。
让我给你看看密码：
index.js
import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, combineReducers } from 'redux'
import { Provider } from 'react-redux'
import { Router, Route, IndexRoute
浏览 2提问于2016-07-08得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
