问题标签 [react-component]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 反应失去对输入字段的关注（动态添加的组件）
堆栈：React16、ES6、Redux
我目前无法弄清楚这里出了什么问题。这里的目标是在单击添加按钮时动态添加无限数量的组件（一个一个）。我需要让它们出现，如果可能的话，一对或更多，例如，如果我点击添加按钮，每次应该出现 2 个字段（一个选择字段和一个文本字段同时出现，例如）
在 Redux 的帮助下，我能够使组件出现，并且我还能够正确管理数据（一切都连接在应用程序的背面）
这里的问题：
当尝试在输入字段中输入文本时，它总是失去焦点。我已经看到，每次更新我的道具时，名为 MultipleInputChoiceList 的整个组件都会再次挂载，并且每个字段都会重新创建。这就是我需要在这里解决的问题：
编辑：MultipleInputChoiceList 组件是通过条件渲染 HOC 安装的（它需要一些值并检查它们是否为真，如果是，它会在不触及整个表单的情况下渲染组件）
条件渲染HOC.js
编码
这里使用的 TextField ：
TextFieldGeneric.js
我也明白部分问题在于父类的渲染方法（MultipleInputChoiceList.js）......
任何帮助或意见真的很感激！
reactjs - 需要帮助识别几个反应组件滑块
我有一个项目，我需要合并一个滑块以允许用户选择一系列配置。我可以使用滑块并让它工作，但我需要在一个表单上有多个滑块，并且 onChange 事件返回的唯一内容是范围类型滑块的数字或数字范围。有谁知道如何命名这些？
reactjs - 仅当道具更新（而不是状态）时才反应组件挂钩
当且仅当我的组件的道具发生更改时，我想启动一些行为。过去我使用过componentWillReceiveProps，但在当前的文档中，这似乎已被弃用。文档似乎表明这componentDidUpdate是新建议，但是这会在任何更新（包括状态更改）时触发。getDerivedStateFromProps也提到了，但这需要是静态方法。
我可以编写一些代码来运行所有的prevPropsand this.props，但这似乎是重复的。
reactjs - 通过 F12 将 react 输入值从 disabled 或 readOnly 更改为 normal
页面渲染，输入“readOnly”或“disabled”属性为true。然后我按“F12”，手动删除readOnly或disabled属性。然后，我在文本框中输入。但是不允许。
reactjs - 在由 Axios 获取请求填充的组件中显示数组
我有一个反应组件，它使用 Axios 从 API 获取一堆照片。
它可以工作，但现在我不知道如何在组件中显示图像。
如何使用照片数组并将它们显示在我的组件中？
下面是 axios 返回的数组的截图：
这是我的组件：
谢谢！
reactjs - 检查数组时无法读取 null 的属性“长度”
我正在尝试在网站上展示一些照片。每次我尝试，我都会收到这个错误：
无法读取 null 的属性“长度”
}
导出默认 ImagePlayer；
我知道我做错了什么。如果有人能看到任何东西，请告诉我。
谢谢！:)
reactjs - 从组件创建和调用函数
我想这可能是一个简单的问题，但我想知道我应该如何以及在哪里定义一个函数，以便我可以从任何组件中调用它来响应？
假设我有一个功能可以在安装某个组件时将页面滚动到顶部。我已经在我需要效果的每个组件的 componentdidmount() 中包含了该功能。我可以在 app.js 之类的其他地方定义它，然后在需要的地方调用它吗？如果是，该功能是否应该包含在渲染中或其他地方。
顺便说一句，我正在使用创建反应应用程序
谢谢
javascript - 视频反应组件显示错误
我在我的项目中使用 react-video-player 组件，在页面中使用它时，它向我显示以下错误。我附上了截图。
任何人都可以帮忙吗？我有以下代码：
而且我有以下配置文件，可以帮助您理解错误。
/* webpack.config.js */
reactjs - 为什么我的子 React 组件只有一部分显示在父 React 组件中？
我有一个使用子组件的父组件，如下所示：-
的CSS是这样的： -
当我在父组件中使用它时，仅显示按钮“外部” div 不可见是什么原因？如果我单击检查元素，外部 div 似乎存在于页面顶部某处但它不可见.
reactjs - 我应该如何按照单一责任模式处理组件状态
我是 ReactJs 的新手，并试图遵循最佳实践。根据我的研究，我遇到了几篇相互矛盾的文章，讨论了应该如何实现。
状态是否应该依赖于从父组件传递下来的属性？在下面的比较中，它们都遵循 SRP，但不确定哪个是最好的。希望得到您的建议，谢谢！
1. -- React.js 中组件状态的最佳实践
首先，可能也是最重要的一点，组件的状态不应依赖于传入的 props。（请参阅下面的示例，了解我们不应该做什么）
2. --一个可靠的 React 组件的 7 个架构属性
让我们重构一个职责：渲染表单字段并附加事件处理程序。它应该不知道如何直接使用存储......组件从一个道具initialValue接收存储的输入值，并使用道具函数saveValue(newValue)保存输入值。这些 props 由 withPersistence() HOC 使用 props 代理技术提供。