Vuejs push elements in array and localStorage

Question

I am modifying a prestashop blockwishlist module and I am trying to put the products added to the offline wishlist in localstorage. I managed to do this however when I reload the page it replaces my stored elements with the new elements. Except I would like to keep all the added elements. Here is the vuejs code:

  import removeFromList from '@graphqlFiles/mutations/removeFromList';
  import prestashop from 'prestashop';
  import EventBus from '@components/EventBus';

  export default {
    name: 'Button',
    props: {
      url: {
        type: String,
        required: true,
        default: '#',
      },
      productId: {
        type: Number,
        required: true,
        default: null,
      },
      productAttributeId: {
        type: Number,
        required: true,
        default: null,
      },
      checked: {
        type: Boolean,
        required: false,
        default: false,
      },
      isProduct: {
        type: Boolean,
        required: false,
        default: false,
      },
    },
    data() {
      return {
        isChecked: this.checked === 'true',
        idList: this.listId,
        listOffline: [],
        exists: null,
        checked: false
      };
    },
    methods: {
      checkIfExists(productAttributeId) {
        this.exists = this.listOffline.some((item) => {
          return item.id_product_attribute === productAttributeId
        })
      },
      /**
       * Toggle the heart on this component, basically if the heart is filled,
       * then this product is inside a wishlist, else it's not in a wishlist
       */
      toggleCheck() {
        this.isChecked = !this.isChecked;
      },
      /**
       * If the product isn't in a wishlist, then open the "AddToWishlist" component modal,
       * if he's in a wishlist, then launch a removeFromList mutation to remote the product from a wishlist
       */
      async addToWishlist(event) {
        event.preventDefault();
        const quantity = document.querySelector(
          '.product-quantity input#quantity_wanted',
        );

        this.checkIfExists(this.productAttributeId)
        if (!this.exists) {
          this.listOffline.push({'id_product': this.productId, 'id_product_attribute': this.productAttributeId})
          localStorage.setItem('listOffline', JSON.stringify(this.listOffline))
        }

        if (!prestashop.customer.is_logged) {
          EventBus.$emit('showLogin');

          this.isChecked = true;

          return;
        }

        if (!this.isChecked) {
          EventBus.$emit('showAddToWishList', {
            detail: {
              productId: this.productId,
              productAttributeId: parseInt(this.productAttributeId, 10),
              forceOpen: true,
              quantity: quantity ? parseInt(quantity.value, 10) : 0,
            },
          });
        } else {
          const {data} = await this.$apollo.mutate({
            mutation: removeFromList,
            variables: {
              productId: this.productId,
              url: this.url,
              productAttributeId: this.productAttributeId,
              listId: this.idList ? this.idList : this.listId,
            },
          });

          const {removeFromList: response} = data;

          EventBus.$emit('showToast', {
            detail: {
              type: response.success ? 'success' : 'error',
              message: response.message,
            },
          });

          if (!response.error) {
            this.toggleCheck();
          }
        }
      },
    },
    mounted() {
      console.log(this.exists);
      this.checked = JSON.parse(localStorage.getItem('listOffline')).some((item) => {
        if (item.id_product_attribute === this.productAttributeId) {
          this.isChecked = true
        }
      })
      /**
       * Register to event addedToWishlist to toggle the heart if the product has been added correctly
       */
      EventBus.$on('addedToWishlist', (event) => {
        if (event.detail.productId === this.productId) {
          this.isChecked = true;
          this.idList = event.detail.listId;
        }
      });

      // eslint-disable-next-line
      const items = productsAlreadyTagged.filter(
        (e) => e.id_product === this.productId.toString()
          && e.id_product_attribute === this.productAttributeId.toString(),
      );

      if (items.length > 0) {
        this.isChecked = true;
        this.idList = parseInt(items[0].id_wishlist, 10);
      }

      if (this.isProduct) {
        prestashop.on('updateProduct', ({eventType}) => {
          if (eventType === 'updatedProductQuantity') {
            this.isChecked = false;
          }
        });

        prestashop.on('updatedProduct', (args) => {
          const quantity = document.querySelector(
            '.product-quantity input#quantity_wanted',
          );

          this.productAttributeId = args.id_product_attribute;

          // eslint-disable-next-line
          const itemsFiltered = productsAlreadyTagged.filter(
            (e) => e.id_product === this.productId.toString()
              && e.quantity === quantity.value
              && e.id_product_attribute === this.productAttributeId.toString(),
          );

          if (itemsFiltered.length > 0) {
            this.isChecked = true;
            this.idList = parseInt(items[0].id_wishlist, 10);
          } else {
            this.isChecked = false;
          }
        });
      }
    }
  };

Do you have an idea what I should do to prevent it from deleting everything I have in localstorage and adding items as it goes. Another constraint should also be checked if the elements do not already exist, if they exist they should not be added. Thanks for your help.