• 在React中的表单值中仅插入唯一ID

    我是React的新手,应用程序中有两个输入字段,一个用于ID,另一个用于Name,我使用了两个组件,在父组件中,我将所有状态和表单保持在另一个组件中。我的目的是检查用户输入的id,每次id都应该是唯一的,如果相同,则应弹出警报,焦点将转到ID输入字段,并且应该执行相同的操作,直到ID不同为止来自所有对象(状态对象) 我的app.js文件是 import React, { Component } from "react"; import Form from "./Form"; export default c...
  • React组件确实已安装但实际已卸载

    我对componentDidMount和componentWillUnmount行为有一个奇怪的问题。卸下组件后,由于HOC的影响而再次装回,它来自称为react-stockchart的库 Something like this: fitWidth(MyComponent). The behavior of unmount and remount again, whenever the width change is expected. componentDidMount() { this....
  • 反应不确定如何将更新的值传递给子组件

    我想制作一个翻译器应用程序,将英语句子翻译成有趣的语言,例如Yoda,Sith等。我找到了一个API。 我的主要逻辑是,创建一个Translator组件,该组件具有一个Input组件(在此处键入英语句子)和一个Output组件(向您显示翻译后的文本)。并且Translator组件还有一个LanguagePicker组件,它只是一个下拉列表。我的问题是: 我成功地从LanguagePicker和Input组件检索了输入和所选语言,问题是,我不知道如何在每次新翻译时将其传递给Output组件。 这是我的翻译器组...
  • 滚动一点后,我需要在底部添加一个粘性div

    我需要一个粘性div,仅在完成一定量的滚动后才显示。 我能够从一开始就获得粘性div,但是我希望一旦滚动整个段落1时,黄色粘性div就显示出来。 这就是我得到的 This is something I want.. when paragraph 1 is showing and once the paragraph 1 is scrolled then i want the sticky div to appear on bottom like this 附言:我不允许显示文本,所以我改用lore...
  • 在useEffect中使用useState时,地图不是函数

    我有一个简单的应用程序,该应用程序需要API才能检索订单。 它是带有打字稿的recat功能组件。 我只想显示所有广告的描述。 我检查了许多教程,并在这里讨论了线程,并使用useEffect更改了状态,useEffect包含函数,该函数从API请求数据并通过useState传递数据。 一开始,我认为在父级使用useEffect,useState并将props中的广告传递给子级就足够了。 后来,我在子(GeneralAdvert.ts)文件中执行了相同的操作,但是仍然出现以下错误: × TypeError: a...
  • 如何使用带有Hooks的react.js提交多部分表单?

    我正在尝试将数据从html表单传递到我的handleSubmit函数。 我的钩子声明: function RegisterForm() { const [formData, setData] = useState({ userName: '', email: '', passWord: '', matchWord: '', }) 我的handleSubmit函数: function handleSubmit (event) { eve...
  • 重新更新数据时UseEffect挂钩无法正常工作?

    我有一个订单列表,我正在使用FlatList来呈现它们, 我应该有2个主要概念,即“加载更多,拉动刷新” 在我的情况下,用户可以编辑订单,然后拉动刷新以获取新更新的数据,而在另一种情况下,可以加载更多“分页”。 所以 加载更多功能可以正常工作,并且可以从服务器获取新数据并与旧数据一起推入状态, 但是拉动刷新不起作用,尽管setState触发了获取数据的功能,但它并没有更新数据,我可以在控制台中看到更新的数据,它只是呈现旧数据! 这是一个代码片段。 const OpenedAppointments = () ...
  • 如何使用React从表中获取行数据?

    我有一个显示一些数据的表。其列之一包含一些操作图标,可通过onClick从特定行中获取高级信息。我需要从行中获取数据并将其呈现在另一个组件中。我该如何实施? 下面是代码: const MainContent = () => { .... .... .... const routeContents = (route, index) => { return ( <tr key={index}> <td>{route.appName}</td> ...
  • 如何在NextJS中正确使用Sass

    我一直在用scss模块设计NextJS应用的样式,并且运行良好。后来我回来从事其他工作,突然被这个错误击中: Syntax error: Invalid CSS after "...ound: variables": expected expression (e.g. 1px, bold), was ".$main-gradient-bac" I am confused because I had not made any changes and it had been running fine ear...
  • 我究竟做错了什么? Object(…)不是函数,执行deleteItemMutation时deleteItem函数会引发错误。 React和GraphQL

    我是新来的人和GraphQL。我正在通过基于项目的学习(待办事项申请)进行学习。 我正在研究在单击列表项时删除“任务”的功能。我的App.js如下所示: import React from 'react'; import ApolloClient from 'apollo-boost'; import {ApolloProvider} from 'react-apollo'; import ItemList from './components/ItemList'; import AddItem from ...
  • 如何在React程序中使用外部CSS文件

    所以我已经创建了一个使用react生成随机报价的网页。 这是网页的代码: @import url('https://fonts.googleapis.com/css2?family=Lora:ital@1&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap'); @import url('https://fonts.googleapis.com/css2?fami...
  • 如何将Azure Z2C与React集成

    I am working with react and I have to give my user login through Azure B2C, So I am trying to do that but I am not able to find out how to do that and what is the. 我尝试过的 我从Microsoft网站获得了这个示例,该示例使用纯JavaScript(普通)完成,我不知道如何在我的react代码中实现此示例。 So I tried to m...
  • React.js使用上下文挂钩加载更多内容

    我尝试了很多博客和教程,但仍然无法解决。 They all using useState but in my case i used context hook. How can I achieve something like this medium blog or this one Simple Load more with React 无法确定我可以将“ getStudents”放在带有更多加载功能的useEffect挂钩中的位置。 学生.js import { CSSTransition, Trans...
  • 在reactJS上更新项目

    我正在学习有关reactJS的课程,以使用axios更新项目。我被困在加载预填充表格的位置。我设置了一个按钮,该按钮调用应通过URL重定向到itemEditForm的函数,但没有任何反应。您能帮助您理解这一步骤吗? 这是我的代码: class ListBooks extends React.Component { constructor(props) { super(props); this.state = { error: null, data: [], numbe...
  • 为什么插入地图的最后一个元素-REACT

    迭代地图时遇到问题在我的应用程序中,我有3个数组的流程,任务和数据。我在流程中有任务,而在任务中有数据。因此,我迭代了嵌套数组:DataProcesos(process)和tareas(任务) {this.state.DataProcesos[0].tareas.map((tarea, index) => ( <div key={index} style={styles.container}> ...... ............. ...
  • ReactJS-如何在子组件内部获取由道具从父组件传递来的详细信息?

    我有一个具有表单的组件,可以从该表单中选择三个选项。一旦选择了这些选项中的任意一个,就会在下面呈现一个子组件。该子组件需要根据输入从服务器获取数据。 我遇到的问题是,尽管我能够将数据向下传递到子组件,但是除非我在父组件上选择默认选项,然后选择另一个值,否则子组件将无法获取。 Here is my code: codesandbox: https://codesandbox.io/s/affectionate-forest-7l0qb App.js import React, { Component } fr...
  • Reactjs-单击按钮重新呈现数据

    我正在使用API​​来获取一些数据。页面加载时,它会获取一些随机数据,但我想允许用户通过单击按钮对数据进行排序。我做了一个函数,可以从我正在使用的API中对这些数据进行排序。我现在想做的是:当单击排序数据的按钮时,我希望将新数据替换为旧数据。 这是我当前的代码: class Data extends React.Component { constructor(props) { super(props); this.state = { data: [], ...
公告

欢迎访问 goshare  点击这里设置您的邮箱  可以接收站内跟帖、回复邮件提醒,不错过任何一条消息。

关注公众号订阅更多技术干货! 码农俱乐部