score:1

Accepted answer

keep the state only in the parent, and pass it down as a prop, as well as another prop - a function which, when called, sets the age in the parent.

you also need to correct the shape of onchange - it accepts an argument of the event, not of the new value.

// in creategame
const setage = i => (newage) => {
    setquestions([
        questions.slice(0, i),
        { ...questions[i], age: newage },
        questions.slice(i + 1),
    ]);
};
// ...
<grid item lg={5}>
    <selectfield age={questions.age} setage={setage(index)} />
</grid>
export default function selectfield({ age, setage }) {
    // ...
    <select
        value={age}
        onchange={e => setage(e.currenttarget.value)}

score:0

you can go through these steps

- step 1 make an onchange event listener

    <selectfield onchange={handlequestion}/>   

- step 2 use hooks to make a state inside functional component
   

const [question, setquestion] = usestate("")

- step 3 make the method that you had called in step 1

    const handlequestion = () =>{
             //first get the value coming fron the onchange listener
             console.log(e.target.value);
             //set the state to the question
             setquestion(e.target.value)
    
        }

- step 4 pass the value to the question

    <textfield
             value={question}//pass the questions state value here
            />

Related Query

More Query from same tag