如何将布尔值传递给控件React.Js
类应用程序扩展React.Component {
constructor(props) {
**// Calling super class constructor**
super(props);
**// Creating state**
this.state ={
video.controls= false
}
}
render() {
return (
<div className= "container">
&
浏览 2提问于2022-06-30得票数 0
这3个点在react.js或redux中的用途是什么？
const something = (state = initState, action) => {
switch (action.type) {
case something:
return { ...action.response };
default:
return state;
}
};
浏览 1提问于2020-04-02得票数 1
回答已采纳
1回答
与反应状态作斗争
、、
我试图建立一个简历生成器网页应用程序，我有问题的正确设置状态，以便他们显示正确的信息。问题是，我似乎不知道如何设置状态，以便我的简历预览正确呈现，我已经尝试了一个不同的事情，没有任何效果。欢迎您提供任何建议或解决方案。
至于代码，这里有一个托管的
此外，内嵌沙箱的代码也会下降：
App.js
import { Component } from "react";
import "./styles/App.css";
import CV from "./cv/CV";
import Form from "./form/Form";
浏览 10提问于2022-08-04得票数 0
我正在尝试使用一个带有useState钩子的intialState同时启动几个状态，并且它们是在几个单击事件上分别设置的。检查以下示例：
const {useState} = React;
const Example = () => {
const initialState = {
name: 'Tom',
age: 30,
id: 1
};
const [state, setState] = useState(initialState)
const handleClickName
浏览 16提问于2020-11-17得票数 0
回答已采纳
我是一个反应初学者，我正在学习如何与useReducer和useContext一起工作。我正在处理的一个非常简单的学习示例只是一个名为问候的组件，它接收从StateContext传递的状态，它显示来自Main.js的用户名称(Mike)，并且它有一个按钮，它应该将这个操作分派给John。问题是，当单击按钮时，什么都不会发生，并且问候语组件中的名称保持不变。我注意到，一旦发出动作console.log，就不会触发问候组件中的changeName，这意味着，我相信问候组件不会被重命名。为什么问候语没有重新显示和显示更新的名称？
这是主要的组件：
import React, { useReducer
浏览 2提问于2021-05-28得票数 2
回答已采纳
我使用reactjs和firebase数据库来存储“待办事项”。我可以成功地将对象存储在firebase数据库中。但是，如何在firebase数据库中更新特定的对象。
我的'to-do‘组件，我将对象存储在firebase数据库中。
import React, { Component } from 'react';
import { userRef } from '../firebase.js';
class Todo extends Component {
constructor(props){
super(pro
浏览 0提问于2018-02-23得票数 1
4回答
我有以下代码：
import React,{useState} from 'react'
const iState ={
Name : '',
Email :'',
Salary :0,
Error:{
EName:'*',
EEmail:'*',
ESalary:'*'
}
}
function ReactForm() {
const [state, setstate] = useState(iSt
浏览 6提问于2021-06-04得票数 3
回答已采纳
2回答
更新动态创建的组件
、、、
情况
我有一个父组件，它呈现一些子组件。子组件应显示从父组件传递的信息。
上下文
玩多人游戏的战舰游戏：
父组件包含多达10x30个按钮(子组件)的10x10字段。如果按下按钮，就会发出带有按钮位置的信号到api。api决定按下的按钮是否需要改变它的颜色。
问题
通过更新父组件的状态，如果子组件是动态创建的，子组件道具将不会被更新。
解决尝试
不要动态地呈现Childs：
在我的情况下不可能
使用剩馀
我认为子组件是转储/表示组件，因为它只显示信息。在我的例子中也有100到300个子组件。
参考文献
有100到300个子组件.
问题
我该怎么办？有没有一种不是反模式的解决方案？
当前代码
浏览 0提问于2018-04-16得票数 1
回答已采纳
我一直在考虑使用React ()方法更新嵌套属性的最佳方法。我还可以使用更有效的方法，考虑性能，避免与其他可能的并发状态更改发生冲突。
注意：--我使用的是扩展React.Component的类组件。如果使用React.PureComponent，则在更新嵌套属性时必须格外小心，因为如果不更改state的任何顶级属性，则可能不会触发重呈现。下面是一个沙箱，说明了这个问题：
回到这个问题--我在这里关注的是在更新状态上的嵌套属性时其他并发setState()调用之间的性能和可能的冲突：
示例：
假设我正在构建一个表单组件，我将使用以下对象初始化我的表单状态：
this.state = {
浏览 0提问于2019-01-30得票数 12
回答已采纳
2回答
在React Docs，handling events一文中:状态如何更新为相反的布尔值，我有一个问题。 为什么我们需要在isToggleOn: !prevState之后添加.isToggleOn 为什么我不能简单地编写isToggleOn: !prevState prevState是{isToggleOn: true}。所以!prevState应该是{isToggleOn: false}。我说的对吗？它把我搞糊涂了，因为它听起来像{property: opposite of the boolean.property}。 我知道prevState是什么，我知道.setState()正在更新状
浏览 60提问于2021-07-07得票数 0
回答已采纳
1回答
setState不更新数组
、、、、
我正在用reactjs创建一个todo应用程序，当用户单击输入时，我试图更新我的todo项目列表。当用户单击时，我可以更改该项，但该项不会在状态中得到更新。我不明白为什么状态不更新。我认为这与.map()和将todo对象返回到新数组有关，但我不太清楚出了什么问题。有什么想法吗？
App.js
import React from 'react'
import TodoItem from './components/TodoItem'
import TodosData from './TodosData'
import './App.scss
浏览 3提问于2021-03-11得票数 0
回答已采纳
2回答
为什么我的redux存储中有一个重复的嵌套todos对象？
组件/todoInput.js
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import actions from '../../actions';
class TodoInput extends Component {
constructor(props) {
super(props);
this.state = {
input
浏览 5提问于2017-07-30得票数 1
回答已采纳
如何在同一个对象key: 1中添加具有新Time的keep更新状态？
它应该是这样的：
time: ["21:10:56", "21:10:56", "21:10:56"]
目前，每次我按一个键，它都会创建一个新的对象。
当我在Number Two输入中输入值以拥有自己的key: 2对象并向其添加时间值时，情况也是如此。
const {useState, useEffect} = React;
const App = () => {
const [state, setState] = useState([])
co
浏览 12提问于2020-06-05得票数 0
回答已采纳
我正确地完成了redux教程的所有说明。但是在运行程序之后，当我试图在电子邮件或密码TextInput中输入一个值时，该值不会被放入其中，并且电子邮件输入会立即被清空。我不知道我在哪里做错了事。但我认为这个行动没有正常运作。我希望你能指引我。
在操作目录> index.js中
import { EMAIL_CHANGED, PASS_CHANGED, USER_LOGIN_ATEMT, USER_LOGIN_SUCCESS, USER_LOGIN_FAILED } from "./types";
export const emailChanged = (text) =&
浏览 3提问于2020-12-24得票数 2
回答已采纳
我使用React已经有一段时间了，昨天我在一个基于Typescript的项目中接触到了我的脚。在重构之前，类有这样的状态： interface INavItemProps {
route: IRoute;
}
interface INavItemState {
toggleStateOpen: boolean
}
class NavItem extends Component<INavItemProps, INavItemState> {
constructor() {
this.state = { toggleStateOpen: false };
浏览 18提问于2019-02-19得票数 4
回答已采纳
我目前正在尝试创建一个交互式评论部分，允许用户评论、回复和喜欢/不喜欢他人的评论。由于无法在组件中更新“喜欢”的值，所以当前我一直停留在“喜欢”/“向上投票”部分。
下面是我的Comment组件(它表示注释部分中的一个注释)：
import { useState } from "react";
const Comment = ({
upvotes,
image,
username,
isUser,
replies,
createdAt,
id,
upvoteMethod,
}) => {
const [score, setScore]
浏览 3提问于2022-05-07得票数 1
回答已采纳
我这里有React JS Code。具有2个输入区域。和2个输出区。如何将1对1和2对2联系起来。
class MarkdownEditor extends React.Component {
constructor(props) {
super(props);
this.md = new Remarkable();
this.handleChange = this.handleChange.bind(this);
this.state = { value: 'Hello, **world**!' };
this.md2 = new
浏览 0提问于2020-06-26得票数 0
下面是我的代码：
function State(){
var [msg,set_msg]=React.useState("hello") //not rendered, just to force render
var [data,set_data]=React.useState({version:1})
function onClick(){
set_msg(x=>x+'x') //just to force render
data.version+=1 //changing state in place, but it still
浏览 0提问于2021-01-13得票数 2
回答已采纳
我刚接触React，只是关于component的状态对象如何更新的问题。在分析了一些代码后，我认为：
在更新阶段，状态在shouldComponentUpdate方法之后更新，但在render方法之前更新，我的理解正确吗？
如果答案是肯定的，是不是有另一个专用的方法(比如"UpdatingState")来更新状态对象？
浏览 0提问于2019-10-21得票数 0
我对js的反应是很新鲜的。已经搜索了一点，但还没有得到这个问题的答案：
假设我的页面中有两个动态输入表，每个表都是一个单独的组件。线条也是不同的组件(React类)。在页面上有一个保存按钮。单击保存按钮后，页面的所有信息都应该以JSON字符串的形式收集并推送到服务器上。
对我来说，最明显的方法是通过jQuery收集信息。这肯定会成功的。但这让我觉得这不是一种反应方式。因为react数据是一种绑定方式，所以我不太确定如何更恰当地处理这种情况。有什么建议吗？
浏览 4提问于2016-06-16得票数 1
回答已采纳
我所收到的错误是“React dom.Development.js:55 Uncaught : object作为React子对象无效”(found: object with keys {counter})。如果您打算呈现一组子对象，请使用数组代替。
当我将Counter.js从<p>{this.state.counter}</p>改为<p>{this.props.counter}</p>时就会发生这种情况。
根据我的理解，我使用的是mapStateToProps和mapDispatchToProps，我应该能够至少提取计数器的initialSta
浏览 1提问于2019-02-26得票数 0
我创建了一个名为"CommonStyleGenerator“的组件，以生成具有诸如高度、宽度和bgColor等键的简单样式对象。我已经在组件中创建了文本字段，每当文本在任何文本字段中发生更改时，我都会使用更改的字段键调用onStyleChange，并且在父组件中存储更改后的值。
下面是CommonStyleGenerator.js组件代码：
import React, { useEffect, useState } from 'react';
import { View, Text, TextInput, StyleSheet } from 'react-nat
浏览 1提问于2021-01-26得票数 0
回答已采纳
2回答
我正在尝试使用redux-persist API来持久化我的状态。我的状态结构如下。
var initState = {
searchInp: "",
allProducts: {},
isProductDtlsLoading: true
};
其中allProducts是一个嵌套的对象数组，每个对象结构如下：
allProducts : {
004: {
defaultOffer: null
mrp: 550
productData: [{…}]
productName: "Hair Dryer"
productQty
浏览 2提问于2018-11-11得票数 3
我正在尝试使用Next.js在React中有条件地呈现元素。但是，我的组件UI没有更新状态更改。
我已经验证了在调用this.setState之后状态正在发生变化，但是UI保持不变。
点击h5 "meeee“后，期望UI显示"naaaah”。可以在setState更改后回调中看到this.state.test是假的。
class Sidebar extends React.Component {
constructor() {
super();
this.state = {
test: true,
sections: [
浏览 3提问于2019-08-10得票数 3
回答已采纳
我在我的Ionic React应用程序中添加了一个包含useReducer钩子的上下文。我看到了一些奇怪的行为:当我用一个dispatch调用更新上下文值时，将在页面上更新一个使用者组件，但是选项卡栏上完全相同的组件不会被更新。
我跟踪了。
当我添加console.log语句以检查组件是否被重新加载时，我看到放置在选项卡栏(<TabBarCounter>)中的组件没有被重新加载，即使上下文值已经改变。
当我在上下文提供程序中添加console.log语句以检查是否重新呈现时，我发现在调用dispatch时它也不会重新呈现。
似乎上下文正在本地更新，而不是在全球范围内更新。在中有一个
浏览 2提问于2021-08-05得票数 2
回答已采纳
因此，我正在跟踪从MongoDB官方网站。
在create.js文件中，我们创建Create组件。遵循代码示例：
import React, { useState } from 'react';
import { useNavigate } from 'react-router';
export default function Create() {
const [form, setForm] = useState({
name: '',
position: '',
level: ''
浏览 6提问于2022-12-03得票数 0
1回答
我正在开发一个表单，其中包含一个部分，用户可以在下拉列表中选择演唱会门票的数量和类别。这个组件是动态创建的，它可以有更多的项目(数量+类别)。类别的下拉列表是相互关联的。因此，如果您选择一个类别，则应将其他下拉列表的值设置为相同的选定值。但我还需要每个类别下拉列表的名称进行验证。 下面是我创建类别对象的方法： const createCategory = () => {
let cat = {}
let nestedCat = {}
for (let it in item) {
for (let bt in ite
浏览 29提问于2020-11-09得票数 1
回答已采纳
我编写了一个泛型表组件，用两个不同的数据集实例化了两次。我使用Redux存储水合物道具，我尝试删除一行时，我点击它。
组件显示良好，触发onClick函数，调用减速器。新返回的状态返回前一个状态，而不单击元素。
我的问题是组件没有重新呈现。根据troubleshouting页面()，我似乎没有改变以前的状态(可能只是不知道如何做)，我调用调度()函数，而且我的mapStateToProps似乎是正确的，因为数据在页面加载上显示得很好。
我尝试在reducer.js > table函数中定义初始状态，而不是使用createStore函数，我尝试将“表”还原器拆分为“域”和“主机”还原器(重
浏览 3提问于2017-06-06得票数 1
回答已采纳
我已经从我的上下文文件中传递了一个状态变量和函数：
UserContext：
import React, { useState } from 'react';
const UserContext = React.createContext();
function UserProvider({ children }) {
var [userImages, setUserImages] = useState({
avatar: '/static/uploads/profile-avatars/placeholder.jpg'
});
ret
浏览 0提问于2020-06-10得票数 0
2回答
我有一个带有状态的react原生应用程序： this.state={
nameOne:"team 1",
nameTwo:"team 2",
pointsForEvents:{
lap: 1,
homeRun: 5,
lyre: 3,
oneHandCatch: 5,
burned: 1,
burnOut: 10,
}
} 然后我想更新points
浏览 16提问于2019-03-20得票数 1
回答已采纳
我在用盖茨比。这是我的密码：
import React from "react"
class ContactCard extends React.Component {
constructor(props) {
super(props);
this.state = { form: { name: "test" }, message: ""};
this.handleChange = this.handleChange.bind(this);
}
handleSubmit =
浏览 5提问于2020-10-28得票数 0
回答已采纳
如何使用reactjs正确地获取表单提交的消息计数。
几个小时以来，我一直在努力寻找可能的解决方案。
下面的应用程序提交并显示消息信息，一切正常。现在，我的任务是在用户每次提交消息时实现一个消息计数器。
--这是我为用户实现计数器所做的事情
var senderId ='Nancy101';
const {textCount} = this.state;
var count = textCount[senderId] == undefined ? 1 : textCount[senderId] + 1;
textCount[senderId] = count;
alert(&
浏览 0提问于2019-03-06得票数 0
回答已采纳
我开始在一些前端项目上工作，我需要种植基础，我选择了react和redux。我看了一些教程，开始构建我的项目。
一切都很好，但是突然间我被问题缠住了，我甚至不知道如何描述它。
问题与使用redux、reducers有关。
简而言之，不知何故，我的prevState正在随着newState的变化而改变。最糟糕的是我不能分享更多的信息，我对这个react/redux还不熟悉，所以我甚至不确定这是否可能。示例代码如下：
export default function (state: UserReducerState = initialState, action: Action): any {
浏览 3提问于2021-01-19得票数 1
1回答
反应显示{错误}问题.
因此，我遇到了一个错误，我试图创建一个DOM元素，但它不想工作，尽管它有一个值。
因此我制作了一个验证器，将一个名为'error'的空对象变成一个数组，其中包含两个对象，用户名和密码，然后在数组中包含文本"{value}是无效“的字符串，如果输入字段是空的，我希望它在DOM中显示。但是它不想这么做，这是代码。
不想显示的是这些变量'{errors.password}'，，它们位于最后一个代码段的末尾。
App.js
import React, { useState } from 'react'
import For
浏览 0提问于2020-08-21得票数 1
回答已采纳
1回答
我正在学习，反应，并试图更新输入字段。我正试图形成一种分层的形式。我有一个类组件体和功能组件或子组件表单。我有身体状态的对象，并在形式上更新它。两者都在单独的文件中。在调用函数并将状态设置为击键时，它无法更新输入字段。
class Body extends React.Component{
constructor(props){
super(props)
this.state = {
users : [],
user: {
userName: '',
浏览 2提问于2019-12-07得票数 1
回答已采纳
1回答
我刚开始学习React Native + Redux。似乎我成功地更新了状态，但是视图没有改变(没有重新渲染)。有人能给我一个解决这个问题的建议吗？
我尝试使用console.log进行调试，并轻拍屏幕。
"selectedMenuMap"：Object { "item2"：true，"item3"：false，"}，这只是日志的一部分，我可以看到状态实际上发生了变化……
Reducer.js
import { SELECT_MENU } from './actions.js';
const initialState =
浏览 0提问于2018-06-10得票数 1
我正在学习React.js并阅读react.js官方文档。官方文档给出了一个例子，我对此有疑问： 原始代码： class Toggle extends React.Component {
constructor(props) {
super(props);
this.state = {isToggleOn: true};
// This binding is necessary to make `this` work in the callback
this.handleClick = this.handleClick.bind(this);
}
浏览 21提问于2021-07-25得票数 0
以下是处理输入值更改的示例代码
import React, { useState } from 'react'
function MyName () {
const [ formData, setFormData ] = useState(
{
name:'test',
age:29,
account: {
card:3939939393,
exp:2020
}
浏览 18提问于2020-05-22得票数 0
回答已采纳
2回答
在CatsPage.js的mapStateToProps函数中，console.log(state)的输出显示：
Object
Cats (Object)
Cats (Array)
当我想要筑巢时：
Object
Cats (Array)
我做错了什么？
setup.js
import cats from '../reducers/catReducer';
let store;
const initStore = ({onRehydrationComplete}) => {
store = createStore(
com
浏览 2提问于2017-05-25得票数 1
回答已采纳
我正在学习ReactJS，我正在尝试构建一个按钮网格，这些按钮可以单独选择/取消选择，一旦我按下提交按钮，我就可以收集按下的按钮。我应该如何以ReactJS的方式构建它呢？所有的按钮都应该有相同的尺寸。
一个额外的问题:我如何使用‘按住’事件来选择多个按钮，同时移动鼠标在它们上面？
App.js
import React from 'react';
import Grid from '@mui/material/Grid';
import { styled } from '@mui/material/styles'
浏览 1提问于2021-12-31得票数 0
回答已采纳
我有一个想法，要建立一个反应商店，有点像Vuex。我希望包装器组件接收一个值对象，并使用useContext提供一个对象返回，该对象将state和set附加到对象中的每个键。
例如，如果您将应用程序包装在类似<StoreProvider value={{ color: 'red' }}>的东西中，您可以在任何子const { color } = useContext(StoreContext)中使用它的值和color.state一起使用，然后调用color.set('blue')来全局更改该值。
我用useReducer写了一篇最好的尝试。
impo
浏览 2提问于2022-01-17得票数 1
回答已采纳
1回答
我需要在我的主组件中有一个嵌套的状态。我想出了一个用于reset特性的initialState。
constructor() {
...
this.initialState = {
...
employees: {
manager: {
name: 'Andrew',
age: 27
}
developer: {
name: 'David'
age: 32
}
}
...
};
this.state =
浏览 1提问于2018-04-05得票数 0
1回答
正如下面的代码所示，如何使两个相关的值同步，而不产生无限循环？
如果使用value1 = 3的设置器，我希望更新value2 = '3‘。
import React, {useState, useEffect} from 'react';
const [value1, setValue1] = useState(1);
const [value2, setValue2] = useState('1');
useEffect(() => {
setValue2(`${value1}`);
}, [value1]);
useEffect(
浏览 2提问于2021-04-08得票数 0
回答已采纳
我有一个包含三个字段的表单，handleChange方法在第一个字段(DateOfBirth)中工作，但在(Id1)和(Id2)字段中不工作。
由于某种原因，setState在试图更改(Id1\Id2)字段的值时返回此错误。
“组件正在将文本类型的受控输入更改为不受控制的输入。输入元素不应从受控制的输入转换为无控制的输入(反之亦然)。决定在组件的生命周期中使用受控或不受控制的输入元素”。
import React, { Component } from 'react';
class Form extends React.Component {
constructor
浏览 0提问于2018-03-18得票数 6
回答已采纳
如何更新react js中嵌套对象的状态(在我的示例中为DeviceProperties )( IPAddress、用户名和密码)
[
{
"DeviceId": 217,
"Name": "My Name",
"PairedNetworkName": null,
"Description": null,
"VersionNumber": null,
"DeviceProperties": {
"IPAddres
浏览 2提问于2020-01-17得票数 0
1回答
我不会扩展组件类，而是尝试使用usestate来管理状态。现在，我希望在特定条件下向方法personList中的togglePersonsHanler变量添加person组件。我希望添加一个HTML标记列表，如下所示
<person name="person1" age=31>
<person name="person2" age=26>
<person name="person3" age=35>
但是在控制台日志中，我得到了如下所示的personList
{$$typeof: Symbol(react.el
浏览 4提问于2020-03-22得票数 1
回答已采纳
1回答
每次单击increment按钮时：
期望:当前count已记录
实际：count的初始值，即记录为3
import React, { useState, useEffect } from "react";
function SomeLibrary(props) {
const [mapState, setMapState] = useState(undefined);
useEffect(() => {
console.log("setting map");
// Run exactly once at mount of com
浏览 1提问于2020-07-22得票数 1
我不明白为什么我要收到这个错误"TypeError: this.props.reviews.map不是一个函数“为我的ReviewsContainer文件。
我觉得我遗漏了什么，但我相信我在Review组件中定义了我的道具。
我有一个评审组件，在这里：
/components/reviews/Reviews.js
import React from "react";
import { NavLink } from "react-router-dom";
const ReviewCard = props => {
const url = `
浏览 3提问于2020-11-05得票数 0
回答已采纳
1回答
我有一个问题要呈现来自API的问题，我创建了状态并使用useEffect调用API，但是当我想要呈现它时，它破坏了我所有的css来呈现一个空白页面，我尝试将组件移动到App，但问题仍然存在。
这是我的应用程序：
import React from 'react'
import './App.css'
import FirstPage from './components/firstPage'
import Quiz_page from './components/quiz'
function App() {
const [s
浏览 8提问于2022-08-29得票数 1
回答已采纳
编辑:问题与条件有关。谢谢你们！ 我正在设计一个使用开源应用程序接口的covid19观察器应用程序。我注销状态以查看它是否更新，它确实更新了，但当我将状态传递给组件时，它不会传递数据。 所以我在render()上加了一个条件，看起来状态没有更新，所以组件没有得到它。可能是因为componentDidMount在render之后运行。我该如何修复它？ App.js import React from 'react';
import Homepage from './pages/homepage/homepage.component.jsx';
import
浏览 12提问于2020-04-30得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
