I'm working on a react
project, and I'm using different classes.
I would bring a number value into a props for another class but it doesn't work.
const [refreshRate, setRefreshRate] = useState(60);
function changeRefreshRate(e) {
setRefreshRate(e.target.value);
}
let list = [
{
id:'weather',
label:'Weather',
widget:<Weather refreshRate={refreshRate}/>, //not update
checked: false
}
];
console.log(refreshRate)
return(
<div>
<DragDropContext onDragEnd={handleOnDragEnd}>
<Droppable droppableId="widgets">
{(provided) => (
<ul className="widgets" {...provided.droppableProps} ref={provided.innerRef}>
{widgets.map(({id, label, widget, checked}, index) => {
return (
<Draggable key={id} draggableId={id} index={index}>
{(provided) => (
<li ref={provided.innerRef} {...provided.draggableProps} {...provided.dragHandleProps}>
<Checkbox id={id} label={label} onChange={_onBoxChecked} />
{checked ? widget : ""}
<div>
<input class="boxnbr" type='number' min='0' onChange={changeRefreshRate}></input>
In my Weather
class I receive 60 in any case. Even if I change my RefreshRate
it is not sent. But, in my console log of this class, I can have the good input. So, my setRefreshRate
works. How is it possible?
You can pass your initial state as first argument to useState like this:
const Weather = (props) => {
const [refreshRate, setRefreshRate] = useState(props.parentRefreshRate);
...
}
where parentRefreshRate is the prop value which you would send from the parent class.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.