我是 Vue 和 Bootstrap Vue 的新手。我構建了一個使用 API 數據數組的表。<b-modal>該表有一個在子組件中打開的按鈕。該模式具有三個字段，通過單擊按鈕將數據附加到表的數組中。然后該表會更新。到這里為止就好了。問題是：當我嘗試從 推送更多信息時<b-modal>，我之前從 添加的信息<b-modal>在數組和表中都被修改。從API帶來的信息沒有被修改。怎么了？多謝。Vue.component('modal', {    props:['commodity_data'],    template:/*html*/`        <div>                        <b-modal id="addModal" ref="modal" hide-footer title="Add Commodity">                <b-form-group>                    <label>                    Hu Count                        <b-form-input                            id="hu_count"                            v-model="new_row.hu_count"                            >                        </b-form-input>                    </label>                    <label>                    Dimensions                        <b-form-input                            id="dimensions"                            v-model="new_row.dimensions"                            >                        </b-form-input>                    </label>                    <label>                    Weight                        <b-form-input                            id="weight"                            v-model="new_row.weight"                            >                        </b-form-input>                    </label>                </b-form-group>            <b-button variant="success" @click="addRow">Add Row</b-button>         </b-modal>        </div>    `,    data(){        return{            new_row:            {                dimensions: '',                hu_count: '',                weight: '',            }        }    },    methods:{        addRow: function () {                        this.commodity_data.push(this.new_row)            this.$refs.modal.hide()            console.log(this.commodity_data);        }    }})