传递给组件的参数是只读的 ReactJs

Question

我有以下组件可以在弹出窗口中添加评论。我想将汽车传递给组件更新一些值，然后关闭弹出窗口并更新从父级传递的对象。

当我尝试更新汽车对象并尝试将其初始化为新数组或更新任何项目时，我收到一条错误消息，提示其为只读

这是我的代码

interface ICar
{
    id: string;
    comments: IComment[];
}

interface IComment
{
    name: string;
    comments: string;
}

const carComment = (car: ICar) => {
    const [comm, setComm] = useState<string>("");

    if (comm === "" && car.comments !== undefined && car.comments.length > 0) {
        setComm(car.comments[0].comment);
    }

    const handleSaveClick = () => {
        if (car.comments !== undefined && car.comments.length > 0) {
            car.comments[0].comment = comm;
        }
        else {
            car.comments = new Array<IComment>();
            car.comments.push({ comment: comm, name: "Peter" });
        }

        return (
        <>
            <TextField
                id="testMulti"
                label="Comment"
                multiline
                rows={4}
                defaultValue={comm}
                variant="outlined"
                key={1}
                onChange={e => {
                    setComm(e.target.value);
                }
                }
            />
            <Button onclick ="handleSaveClick"> Save </Button>
            </>
    }   
} 
export default CarComment;

Answer 1

在 parent 我添加了

const updateCar = (carComments: IComment[]) => {
...
};

<carComment id={props.id} comments={props.comments} updateCarCallback={updateCar}></carComment>

在子中我添加了

interface ICarCommentProps extends ICar {
    updateCarCallback(carComments: IComment[]): void;
}

and in the handleSaveClick i added 
updateCar(car.comments);

传递给组件的参数是只读的 ReactJs

Pass parameter to component is readonly ReactJs

reactjs

react-state