基本问题。我有以下组件： var TopLevelElement = React.createClass({ render: function () { return ( <Grouper top={Top} bottom={Bottom} /> ); } }); var Grouper = React.createClass({ render: function () { return

我有一个React应用程序。我正在为我的过梁配置使用。 当我使用webpack或systemjs作为模块管理器时，一切都很好，但当我使用bower时，我会遇到来自jsx模板的react/jsx no undef或react in jsx scope等问题 例如： return ( <Title/> ); 返回( ); 抛出'Title'未定义（react/jsx no undef）通常，在使用网页包时，您将执行从“/Title.js”导入标题的操作或var Title=r

我有这个路由模式 <Router history={browserHistory}> <Route path="/admin" component={AdminApp} onEnter={AdminApp.authCheck} > <Route path="/admin/new" component={NewPostAdmin} /> <Route path="/admin/posts" component={PostsAdmin}>

当设置react路由器应用程序时，我经常在回调上设置它以表示授权过滤器。这让我想到了这样的设计： # before, in my root component requireAuth() { ... } noAuth() { ... } render() { return ( <Router history={this.props.history}> <Route path='/' component={App} onEnter={this.requir

我发现一个问题的答案，代码如下： var condition = true; return ( <Button {...condition ? {bsStyle: 'success'} : {}} /> ); 它看起来像扩展语法，但条件是一个布尔值。我很难找到解释发生了什么的文档。如果您签出： 扩展语法允许在以下位置扩展表达式 多个参数（用于函数调用）或多个元素（用于 数组文字）或多个变量（用于解构赋值） 这是意料之中的事 如果您看到，jsx语法中的spread运算符用于计算

我目前正在使用react native构建一个像tinder这样的移动应用程序，我使用native base package中的Deck Swiper，我没有找到一个解决方案来解决如何在点击按钮时刷卡的问题 此链接是我一直使用的native base中的Deck Swiper组件： 有关如何使用按钮点击刷卡的任何建议或想法？首先，您需要保存DeckSwiper组件的参考： <DeckSwiper ref={(deck) => this.deck = deck}> this.d

am使用react+redux和路由器 在路由器路径索引页中，使用/myproject和其他路由器，同时使用/myproject/xxx/yyyy等，如果给出索引路径=“/”则如何在react npm服务器中解决此问题，但不在apache2或任何其他文件中 这是我的代码片段： <Router history={browserHistory}> <Route name="index" path="/Referral" component={App} /> <Route

当我尝试部署测试应用程序时，我从react和redux收到此错误。但是这些错误不会出现在我的本地计算机上 但后来我意识到我的本地机器没有使用捆绑包的缩小版本（但我部署的应用程序使用的是缩小版本），所以我缩小了捆绑包，然后砰的一声！错误出现了。你知道为什么会发生这种情况以及如何解决吗 提前感谢那些愿意帮忙的人 好的，我明白了 因此，缩小后，react将查找process.env.NODE\u env，并检查它是否设置为production。有两种解决方案： 解决方案一 最简单的方法是运行webpa

我对React Native非常陌生，我遇到了以下错误： 必须包装相邻的JSX元素 代码： render（）{ 返回( Actions.register（）> //这就是我得到错误的地方 ); } } 谢谢你的帮助！ 谢谢 onPress={（）=>Actions.register（）}>您忘记关闭{，请这样写：onPress={（）=>Actions.register（）}>噢，哇，非常感谢！ render(){ return( <UpperPadding>

我是新来的 我正试图在我的react应用程序中实现这一点。 现在，我不希望它像示例一样显示在我的主页上，而是在导航到该组件时显示在我的“MyStories”组件中。但似乎我做错了什么，现在我收到了这个错误 未捕获错误：MyStories.render（）：必须返回有效的React元素（或null）。您可能返回了未定义、数组或其他无效对象 这是我的密码 import React from 'react'; import { Router, Route, browserHistory } from

我在componentWillMount中调用了一个action creator，该action负载的返回使用setState分配给state。但是，在componentDidMount中，我无法访问该属性，因为异步调用尚未完成。在ComponentDidMount中访问此数据的正确方法是什么 //component class Dashboard extends Component { componentWillMount() { this.setState(this.props.g

这是引发错误的代码部分： session.subscribe("acme/channel", function(uri, payload){ console.log("Received message", payload.author); var myObject = { 'content': payload.message, 'author': { 'username' : payload.author },

在redux中，我理解状态是不可变的，当您创建新状态时，您实际上是在用任何新信息更新对象，然后完全重写状态 今天我有一个想法，我不知道这有多愚蠢 继续重写状态在计算上是否昂贵？我知道这是Redux的主要范例之一，但我想知道从内存和空间的角度来看这是否有意义 您可以在Redux中更改状态，但不应为此付出任何代价，因为您将使用 在普通JavaScript或任何框架中，改变对象可能会带来许多副作用，这可能会让调试非常痛苦。除非有必要变异，否则你应该选择 现在回到Redux，reducer中的函数应该是

假设我有一个类似这样的ReactJS类： class MyComponent extends Component { onTouch = () => { if(this.calendar1) { this.calendar1.getValue(); this.calendar1.setValue('something'); this.setState({key: 'something'}); } } render() {

我正在尝试对页面进行更改，一旦addListItem运行了一个名为“list”的数组，它实际上是一个redux状态，需要更新。我设法更新了它，但返回的不是数组而是对象。我需要返回一个数组，但是我不知道如何重构代码来实现这一点 /** *添加项 */ 案例“播放列表/addListItem\u成功”：{ 返回{ ……国家， 名单：{ …state.list， [action.meta.position]：{ …state.list[action.meta.position]， 状态：正确 } }

我需要一些帮助来实现搜索和滚动，以点击反应本机。做了很多搜索，结果发现了一些死胡同（找到了一些refsexamples，我无法开始工作） 尝试构建此代码段作为开始： import React，{Component}来自'React'； 从“react native”导入{Text，View，ScrollView，TextInput，StyleSheet}； 导出默认类应用程序扩展组件{ 状态={ 正文：“41” } render（）{ 返回( this.setState（{text}）} 值=

我是React的初学者，可能所有这些都做得不对，但如何更新具有自己函数/变量的第三方对象的状态 这是我的密码： import React, { Component } from 'react'; import { mxGraph, mxRubberband, mxCell, mxGeometry, mxGraphHandler, mxEdgeHandler, mxParallelEdgeLayout, mxLayoutManager } from 'mxgraph-js'; class Gra

假设以下情况：作为登录用户，您正在访问自己的配置文件页面。标题菜单将显示您作为登录用户的化身，页面的其余部分将显示您的用户公共信息 您从api获得了一个用户列表，需要处理其中两个用户的数据：登录用户和正在访问配置文件页面的用户（在上述情况下，实际上是同一个用户）。 复制store.users、store.currentUser和store.myUser中的数据将是一个非常糟糕的主意（每次修改数据时都需要同步这3次出现的数据）。但我不希望每次修改用户列表中的某些lambda用户数据时，都重新呈现使

我希望将数据从子组件传递到父组件 这是我的密码： 在我的子组件中，我有一个要显示在父组件中的const=priceShowed。因此： Price:{priceshow} 我曾尝试将函数放置在父级中，然后将它们作为道具传递给子级，这样我就可以访问const=priceShowed，因为它将位于父级中，但I显示为未定义。代码如下：您可以将状态保留在父级中，并将函数作为prop传递，该函数将从子组件调用，并使用适当的参数更新父级中的状态 示例 类应用程序扩展了React.Component{ 状态

我有一个fullstack应用程序，其后端是Create React app和Express.js 开发设置（CRA在端口3000上运行）由CRA的代理实现，因此我可以将某些路由直接转发到后端（在端口5000上运行）： 对于注销用户，我有相应的路径： app.get('/api/logout', (req, res) => { req.logout(); res.redirect('/'); }); 以及一个指向此路线的注销按钮： <a key="logout" h

我对CORS使用React fetch和Spring Boot有一些问题 React应用程序在localhost:3000上运行 Spring引导后端在本地主机3001上运行 我的问题是，当我尝试使用带有url的fetch登录时，javascript中的响应不包含授权令牌 后端端的身份验证工作正常 当我打开Chrome Inspector时，我可以在登录请求的网络选项卡中看到授权，只是javascript响应中缺少授权 React fetch请求如下所示：在代码中，const userToken

我正在尝试使用firestore在我的React/Redux应用程序中实现删除功能。但是我遇到了这个错误，无法读取未定义的属性“params”看起来好像我的URL中没有id？我还认为我需要传递我要删除的文档的id，但如何做呢？绑定到onDelete？我认为我的错误与URL中的id有关，该id缺失，但我不确定 import React, { Component } from "react" import { compose } from "redux" import { connect } fro

Font Aowesome文档仅显示如何添加常规/实心字体以作出反应。社交偶像呢 首先，我抓起包裹： npm i --save @fortawesome/fontawesome-svg-core \ npm i --save @fortawesome/free-brands-svg-icons \ npm i --save @fortawesome/react-fontawesome 注意：我将npm I--save@fortwome/free solid svg图标\替换为npm

我正在通过一个练习应用程序来熟悉 在我的应用程序组件中，我有一条路线，作为支付404 class App extends Component { render() { return ( <Router> <div> <Navbar /> <Switch> <Route path="/" exact component={Home} />

我读过很多文章，相信这个问题不是重复的 据 渲染函数是react组件生命周期的一部分，其中ReactDOM 是一个类对象，它公开了一个名为render的方法 将React JSX内容呈现到DOM中 我还阅读了许多文章，这些文章解释了react虚拟dom是如何工作的，它在将节点渲染到真实dom之前使用diff过程 所有的文章（至少我读过的）都提到render（）反映了dom 我想知道那dom是realdom还是virtualdom 实际上，我在理解componentdiddupdate（）时遇到了

使用create react应用程序时，npm start正在运行，如果我检查一个应用程序，在Chrome开发工具中，我只能在Webpack internal文件夹中找到我的项目文件。这正常吗 如果我打开“源代码”选项卡，我会看到更多信息： 似乎ES6代码已更改为ES5，而且每个地方都有\u source:标记 我想如果我在DevTools设置中禁用SourceMap for JavaScript，那些\uu source标记将消失，它们没有消失。即使刷新浏览器或使用npm start重新启动

我有一个React应用程序，我正在使用。由于某种原因，当我将全宽标记为真时，只显示输入字段的轮廓。如果我将fullWidth设置为false，一切正常（除了我的输入控件不是全宽） 下面是一个屏幕截图，显示了当fullWidth为false时它是如何呈现的： 下面是一个屏幕截图，显示了如果fullWidth为true，它是如何呈现的： 请注意，我不能再单击文本框或在文本框中键入任何文本，现在也不会显示我的标签 以下是我的JavaScript代码： import React from 'reac

假设我有一把这样的钥匙： { key1: "my name is {{name, bold}}" } 我希望有这样一个功能： i18next.init({ interpolation: { format: function(value, format, lng) { if (format === 'bold') return <strong>{value}</string>; return valu

我正在学习React.js，并且在课程中使用UDE。问题是，自从课程完成后，React已经更新，CSS模块也发生了变化。我试图进行研究并编写代码，但这些类似乎不适用。我在浏览器中使用inspect进行了检查，在React选项卡下（安装了扩展名）显示className={undefined}。在inspector选项卡下，它显示 <div>...</div> 编辑： webpack.config.dev.js的第143至150行： 文件在这里 在react的新版本中，应该

我正试图将CSS字符串转换为React.cssprroperties对象，但在Typescript升级到3.5.3时出现键入错误 TLDR；如何将字符串映射到接口允许的属性 export function styleStringToCSSProperties(style: string | null) { const out: React.CSSProperties = {}; if (!style) return null; const properties = styl

我想要一个按钮谁是要下载一个docx文件点击，该文件是静态的，并在图像/下载目录中有以下我已经尝试，并没有运气 首先，试试- <a href={require("../../images/downloads/Gate-Pass-Moving-in.docx")} className="btn btn-sm btn-secondary" download > Download </a> --然后在按钮中-- 我在接下来的两次尝试中都遇到了

React Router似乎在我的应用程序中工作，除了我得到的是一个空白页面而不是我的组件，即使它指向正确的路径 我正在扫描文档，但在查看并搜索Google/此网站后，我无法自行解决该问题 我试过 使router.js文件只包含路由，以获得相同的结果。执行此操作时也指定精确路径 将react router dom重新安装到组件中，以防下载时出错 如果出现问题，请删除提供程序 将代码直接放在App.js文件中的路由器文件中的提供者组件标记之间 这些是涉及的文件 路由器.js import Re

我不明白为什么不去页面，只是简单地更改URL import React, { Component } from 'react' import PropTypes from 'prop-types' import { Link, withRouter } from 'react-router-dom' import classify from 'src/classify' import defaultClasses from './logo.scss' import logo from './lo

我正在使用ant和ReactJs处理一个项目，遇到如下问题：我的数据源是一个对象数组，其中包含一些字段，如id、photoUrl、名称、电话和电子邮件。我使用这个数据源来创建一个表，其中包含列avatar、name、phone number、email和action。操作是一种链接文本编辑，还具有onClick函数，用于编辑表行的信息 <a href="javascript:;" onClick={this.handleEditBtnClick(id)}> E

我完全不熟悉更新/管理/编辑任何webpack/cli工具或版本，也不熟悉使用Thread和Thread Dist等。。。。我最近启动了一个包含Typescript的项目，我们安装了一个第三方npm包，但它并没有让TS满意。此外，Typescript还在大喊useState&setState。有人能给我指出正确的方向吗？非常感谢你的帮助 错误： stdout:“$tsc--declaration\n”+ “../../node_modules/react avatar editor/dist/

我正在使用“gatsby source prismic graphql”将prismic存储库与现有gatsby项目集成，但我发现在构建站点时，窗口对象未定义。这个问题与Gatsby的SSR在build（）期间生成静态文件时引起的问题不同（尽管可能有关联） 我正在使用盖茨比推荐的安全检查（即typeof window！==“undefined”…），在构建时没有问题，但问题仍然存在——即，在本地工作正常的eventListener在构建本身中没有响应。在将gatsby source prismi

我是一个反应新手，我正在做一个测验。我现在想做的是，当你遇到一个新问题时，将类名重置为它的初始状态。我想我想使用componentDidUpdate，但不确定它是如何工作的 componentDidUpdate() { this.setState({ classNames: ["", "", "", ""] }); } 以下是完整的组件代码： class Answers extends React.Component { constructor(pro

各位! 我希望你的帮助 我和CRA创建了一个React项目 后端是端口3000上的graphql+节点 它很好用“ 另外，脚本“precodegen”工作正常，因此在客户端生成schema.json 但是，codegen命令中出现以下错误 请帮帮我。。。！谢谢~ package.json 终端误差 纱线编码 纱线运行v1.17.3 $apollo codegen内省模式http://localhost:5000/graphql --输出schema.json $apollo codegen生成“

我已经有一个先见之明，像这样把道具或状态从父母传给孩子 class Parent extends React.Component{ state = {name: "parent-state"} update = () => { this.setState(state => state.name="example-state"}) } render(){ return ( <ChildComponent {...thi

我在react中创建了一个事件框组件。我想要的是，无论何时调用它，我都将颜色值作为道具传递，这些道具稍后用于设置其边框。目前，我设置了两个硬编码的类名，并将它们作为道具与组件一起传递。因为我无法在样式表中添加所有的颜色类名，所以还有其他方法吗 组件代码 import React from 'react'; class EventBox extends React.Component{ constructor(props) { super(props);

我试图使用useRoute提取参数，如下所示 const route = useRoute(); const { params } = route; const { id, name, } = params; 一切正常，但门楣突出显示了id和name，出现以下错误 类型“object |未定义”上不存在属性“id” 如何克服这个问题。react navigation导出了一些实用程序类型，以便在为自己的组件使用钩子和定义道具时更轻松。它们取决于您首先为导航器定义类型 假

我目前在app.js中定义了我应用程序中的所有路由。希望能够将状态（作为道具）从校准组件传递到GPfSOA组件 function App() { return ( <Router> <div className="App"> <Nav /> <Switch> <Route path="/" exact component={Home} />

我想映射一个图像数组，但因为Directus将图像或文件标识为集合项中的id 现在我需要从第一个请求中的响应映射id数组，然后使用该id在另一个端点中发出另一个get请求，这里就是文件 我使用的数据库是DirectusCms，前端是react.js class ComponentToPrint extends React.Component { constructor(props) { super(props); this.handleLoad = this.handleLo

我没有在我的reactjs项目中使用typescript，但我仍然想用JSDocs来记录我的组件 问题是我有一个带有React.forwardRef的功能组件，我想为ref创建一个JSDoc，因为我正在使用useImperialiveHandle并将不同的值传递给ref 可以使用JSDoc记录ref，以显示传入useImperialiveHandle的方法和属性？如果是，如何进行 我想要的例子在哪里 在组件中，我使用React.fowardRef和useImperialiveHandle exp

在我的功能组件中，我有状态，每当它改变时，我想做一些事情。所以我使用了useEffect，但它给出了“依赖项缺失”错误。在我将错误中显示的所有依赖项放入之后，我得到了无限循环。代码如下： const [keywords, setKeywords] = useState<Keyword[]>(); const [currentPage, pagingConfig, setPagingConfig] = usePaging(); useEffect(() => { c

我有这个复选框 import styled from 'styled-components' import PropTypes from 'prop-types' import React from 'react' const CheckboxContainer = styled.div` display: inline-block; vertical-align: middle; ` const Icon = styled.svg` fill: none; strok

我试图覆盖材质UI栏的颜色。我尝试的第一个解决方案（简化）如下 从“React”导入React； 从“@material ui/core/styles”导入{makeStyles}”； 从“@material ui/core/LinearProgress”导入LinearProgress； const useStyles=makeStyles({ 初级颜色：{ 背景颜色：“f6ce95” }, barColorPrimary：{ 背景色：“f0ad4e” }, dashedColorPrimar

我在调用onChange事件后正在更改状态，该事件不会立即反映。我怎样才能立即改变我的状态。 这是我的父组件代码 import React from 'react'; import {One, test, test1} from './Sample/SampleData'; export const FirstUser = () => { const [data, setData] = React.useState(One) const [id, setId] = Rea

我正在使用express会话、Cookie和React来构建登录系统。目前，一旦用户登录，他们就可以向某些路由发出请求，但如果没有，则不允许 但是，我的问题是应该将用户的用户名存储在哪里。将其存储在localstorage中会导致安全问题吗？或者这是一种安全的存储用户名之类的东西的方法 我不将其存储在cookie中的原因是cookie是httpOnly。这是个好主意吗？我存储在cookie中的所有内容都是用户的用户名，因此我不确定我是否过度使用了安全性，我可以通过让cookie不只是httpOn

我创建了一个reactJS应用程序，它有一个主页和一个详细信息页，主页从一个具有字母数字唯一键的数据库中获取数据，一旦我单击详细信息页并呈现详细信息组件，但当我返回主页时警告：遇到两个具有相同键的子项 此密钥来自firebase数据库 我的App.js function App() { return ( <div className="App"> <Router> <Navbar />