0

Есть компонент календаря

<script>
import DatePick from 'vue-date-pick';
import 'vue-date-pick/dist/vueDatePick.css';

export default {
    components: {DatePick},
    data: () => ({
        date: '2019-01-01'
    })
};
</script>

И я его использую в другом компоненте подключая

<template>
  <div>
      <calendar></calendar>
  </div>
</template>

<script>
    import Calendar from './Calendar.vue';
</script>

Все успешно работает, только как в родительском компоненте вывести значение v-model="date" ?

1 ответ 1

1

Здесь подойдет событийная модель. В дочернем компоненте генерируешь событие. Например при изменении даты.

this.$emit('onChangeDate', this.date);

В родительском компоненте подписываешься на изменения из компонента:

<template>
  <div>
      <calendar @onChangeDate="onChangeDate"></calendar>
  </div>
</template>
<script>
import DatePick from 'vue-date-pick';
import 'vue-date-pick/dist/vueDatePick.css';

export default {
   methods: {
       onChangeDate(date){
          console.log('date from child component: ', date);
       }
   }
};
</script>

2
  • Подскажите пытаюсь в дочернем компоненте <date-pick v-model="date" @blur="onChangeDate"></date-pick>, но он ни как не реагирует на это событие 8 мая 2020 в 15:04
  • Похоже тебе нужно именно это stackoverflow.com/questions/49974289/… .
    – gregman
    9 мая 2020 в 10:00

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.