Firestoreにてコレクション内のドキュメントIDを取得して単体のフィールドの値のみを取得したい

上記の赤で囲った「name」のフィールド値のみを取得して表示したいと考えております。

現状、以下コードのようにdata内の「profileData」へsnapshot.data()として全てのデータを取得して格納し、
template内では{{ profileData.name }} として「profileData」から「name」のみを取り出して表示しております。

これでも表示は出来ていますので問題はないのですが、リファクタリングをしており、
「profileData」へ全てのデータを取得して格納するのではなく、予め「name」のみを格納したいのですが、
どのように記述したら良いのでしょうか。

分かる方いらっしゃいましたらお力添えを頂きたいです。

宜しくお願い致します。

#mypage.vue

<template>
  <div class="mypage">
    <Header />
    <div class="mypage-inner flex">
      <div class="mypage-item flex">
        <Mypageicon class="mypage-icon" />
        <Mypageother class="mypage-other" />
      </div>
      <Mypageprofile />
      <hr class="separate" />
      <h3 class="post-list flex">{{ profileData.name }} さんの投稿一覧</h3>
      <Mypost />
    </div>
  </div>
</template>

export default {
  data() {
    return {
      profileData: {},
      listData: [],
      paginate: ["paginate-listData"],
      bookmarkData: [],
      open: false
    };
  },

  ~ 省略 ~

  created() {
    const currentUser = firebase.auth().currentUser;
    this.uid = currentUser.uid;
    if (currentUser) {
      firebase
        .firestore()
        .collection("users")
        .doc(this.$route.params.uid)
        .get()
        .then(snapshot => {
          this.profileData = snapshot.data();
        });
    }

};
</script>