ReadersView.vue

ReadersView.vue

<!-- src/views/ReadersView.vue -->
<template>
  <v-container>
    <v-card>
      <v-card-title style="font-size:1em">나의 독자들</v-card-title>

      <v-list v-if="readers.length > 0">
        <v-list-item v-for="reader in readers" :key="reader.id" @click="goToUserMylogs(reader.id)">
          <v-list-item-content>
            <v-list-item-title style="font-size:1em">{{ reader.username }}</v-list-item-title>
            <v-list-item-subtitle>{{ reader.email }}</v-list-item-subtitle>
          </v-list-item-content>
        </v-list-item>
      </v-list>

    </v-card>

    <div class="text-center">
      <v-progress-circular v-if="loading" indeterminate></v-progress-circular>
    </div> 

</v-container>
</template>

<script>
import { mapActions, mapGetters } from "vuex";

export default {
  data() {
    return {
      
    };
  },
  async created() {
    const userId = this.$store.state.auth.user.id;
    this.fetchReaders(userId);
  },
  computed: {
    ...mapGetters('mylogs',['readers', 'loading']), 
  },
  methods: {
    ...mapActions('mylogs', ['fetchReaders']),
    goToUserMylogs(userId) {
      this.$router.push({ name: 'userlogs', params: { userId } });
    },
  }
};
</script>