vue.js怎么传日期的值

<template>
  <ChildComponent :date-value="selectedDate" />
</template>

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

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      selectedDate: new Date().toISOString().slice(0, 10) // 格式化为YYYY-MM-DD
    };
  }
};
</script>

<template>
  <div>{{ dateValue }}</div>
</template>

<script>
export default {
  props: {
    dateValue: String // 确保prop类型正确
  }
};
</script>

<template>
  <button @click="sendDate">Send Date</button>
</template>

<script>
export default {
  methods: {
    sendDate() {
      const dateValue = new Date().toISOString().slice(0, 10);
      this.$emit('date-selected', dateValue);
    }
  }
};
</script>

<template>
  <ChildComponent @date-selected="handleDateSelected" />
</template>

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

export default {
  components: {
    ChildComponent
  },
  methods: {
    handleDateSelected(dateValue) {
      console.log('Selected date:', dateValue);
    }
  }
};
</script>

<template>
  <div>{{ currentDate }}</div>
</template>

<script>
export default {
  data() {
    return {
      currentDate: new Date().toISOString().slice(0, 10)
    };
  }
};
</script>

import { createStore } from 'vuex';

export default createStore({
  state: {
    selectedDate: new Date().toISOString().slice(0, 10)
  },
  mutations: {
    setSelectedDate(state, date) {
      state.selectedDate = date;
    }
  },
  actions: {
    updateSelectedDate({ commit }, date) {
      commit('setSelectedDate', date);
    }
  }
});

<template>
  <div>{{ selectedDate }}</div>
</template>

<script>
import { mapState, mapActions } from 'vuex';

export default {
  computed: {
    ...mapState(['selectedDate'])
  },
  methods: {
    ...mapActions(['updateSelectedDate']),
    changeDate() {
      const newDate = new Date().toISOString().slice(0, 10);
      this.updateSelectedDate(newDate);
    }
  }
};
</script>