Estoy tratando de obtener los datos de rangeText en div fuera del bloque de componentes para https://innologica.github.io/vue2-daterange-picker/advanced/#slots-demo pero solo parece aparecer cuando se usa en una ranura.
Estoy tratando de actualizar el texto selectDateButtonText después de que el usuario seleccione las fechas.
Muchas gracias
<template> <div v-click-outside="hideCalendarDropdown" class="select-dates"> <button @click="filterCalendarIsActive = !filterCalendarIsActive" :class="{ 'is-active': filterCalendarIsActive }" class="select-dates__button fw-lt-sm">{{ selectDateButtonText }}</button> <div :class="{ 'is-active': filterCalendarIsActive }" class="calendar-wrapper"> <date-range-picker @finish-selection="datesSelected()" v-model="dateRange" :minDate="minDate" :maxDate="null" :singleDatePicker="singleDatePicker" :opens="opens" :showDropdowns="showDropdowns" :autoApply="autoApply" :ranges="ranges" > <div slot="footer" slot-scope="data" class="date-range-picker-footer"> {{ data.rangeText }} <button class="clear-dates" @click="clearDate()" type="button"> Clear </button> </div> </date-range-picker> </div> </div> </template>Entiendo.
Tuve que $refs el componente
datesSelected() { this.selectDateButtonText = this.$refs['picker'].rangeText; }