Trying to sum up the grandTotal doesn't work

Question

I use the following function in my controller:

sum = 0;
total_price = 0;

get grandTotal() {
this.total_price = this.quantity * this.product_price;
this.sum += this.total_price;
return this.sum;
}

I get quantity and product_price from the onSubmit function:

onSubmit(quantity, product_price){
this.product_price = parseFloat(product_price);
const data = {
quantity,
product_price
};
this.items.push(data);
localStorage.setItem('items', JSON.stringify(this.items));
}

I display grandTotal with the following:

<div> {{ grandTotal | currency:'USD':true }} </div>

I get wild values for grandTotal and I get the error: Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.