If the ID of the registered item exists on the page, get the information of the registered item and then edit @click.once(update) If the registered item does not exist, we try to register @click.once(create). The condition of the method is to render the button element with v-if condition. Execution of the methods was performed with @click.once to prevent duplicate execution.

After loading the data in mounted, itemId clearly exists, but only create methods are being executed. Is there something I am missing?

<button v-if="itemId !== null" @click.self.prevent="update" :disabled="!validRegister">modify</button>
<button v-else @click.self.prevent="create" :disabled="!validRegister">save</button>


<script>
  async asyncData({ $axios, store }) {
     const response = await actions.get.partnerInfo({$axios, params})
     return {
        bannerInfo = response ? response.id : null
     }
  },
  data(){ 
    return {
      itemId: null,
    } 
  },
  async mounted() {
    if(this.bannerInfo.id){
        this.itemId = this.bannerInfo.id ? this.bannerInfo.id : null;
  }

</script>