как перерисовать компонент fullcalendar в vuejs

Question

Я использую библиотеку fullCalendar для vuejs, и мне нужно обновить sh компонент, когда я удаляю событие

<div>
    <FullCalendar :key="componentKey" v-model="FullCalendar"
      locale="es"
      :plugins="calendarPlugins"
      :header="{
        left: 'title',
        center: '',
        right: 'prev today next'
      }"
      :buttonText="{
        today: $t('today')
      }"
      :events="EVENTS"
      :selectable="true"
      :editable="false"
      @select="handleSelect"
      @eventClick="handleEventClick"
    />
  </div>

Я попробовал с ключом обновить компонент sh, используя смотреть и монтировать, но оба бесполезны, компонент не обновляет sh, это происходит только тогда, когда я пытаюсь удалить событие

handleEventClick (arg) {
      request.post('api/festivities/show', {day: arg.event._instance.range.start, name: arg.event._def.title})
        .then(res => {
          Swal({
            position: 'top-end',
            title: res.data.name,
            html: 'information',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Eliminar'
          }).then((result) => {
            if (result === true) {
              request.post('api/festivities/delete', {day: arg.event._instance.range.start, name: arg.event._def.title})
                .then(answer => {
                  //this part should reset the component
                  //the best i could do is this line that reset the browser
                  this.$router.go()
                })
            }
          })
        }).catch(err => {
          console.log(err)
          this.$spinner.close()
        })
    }

, единственное, что я смог сделать, это refre sh маршрут. фактически событие было удалено из БД, но сохраняется в представлении

Answer 1

Вы можете принудительно выполнить повторный рендеринг компонента, задав свойство: key и обновляя его каждый раз, когда вы хотите, чтобы компонент был перестроен.

В вашем случае вам нужно изменить componentKey в этом месте

if (result === true) {
              request.post('api/festivities/delete', {day: arg.event._instance.range.start, name: arg.event._def.title})
                .then(answer => {
                  this.componentKey++;
                  this.$router.go()
                })
          }