I want to render controls from an array of objects.

The controls render from default [{'question' : '', answer : ''}] , but the value does not update back to Attributes when I type in the fields.

A control in the same block with only text stored in a string attribute works fine.

Which step I’m missing to update the array back to the Attributes?

Here is the code including the title Attribute that works as expected.

<PanelBody title={'FAQ'}>
                <TextControl
                    label={`title`}
                    value={title}
                    onChange={ title => {
                        setAttributes({title })
                    }  }
                />
                {questions.map((qa,index) =>
                <><TextControl
                        label={`Question ${index+1}`}
                        value={qa.question}
                        onChange={ question => {
                            questions[index]['question'] = question
                            setAttributes({questions })
                        }  }
                    />
                    <TextControl
                        label={`Answer ${index+1}`}
                        value={qa.answer}
                        onChange={ answer => {
                            questions[index]['answer'] = answer
                            setAttributes({questions })
                        }  }
                    /></>
                    )}
            </PanelBody>