メソッドで取得したデータをpostで送信したい

前提・実現したいこと

メソッドを介して取得した書籍情報をサーバーに送信したいのです。
具体的にはtitle(selectedBook)、author(selectedBook)、image(selectedBook)メソッドで取得した値をサーバー側に送信して保存したいです。
現状template内では値を表示していますが、サーバー側にはどのように送るのが良いのでしょうか。
どうしたらいいかわからないため知恵をお貸し頂きたいです。よろしくおねがいします。

該当のソースコード

Vue
1<template>
2  <v-container>
3    <!-- 選択されたデータの表示 -->
4    <v-card
5      width="900px"
6      min-height="400px"
7      class="mx-auto my-8 pa-3 rounded-xl"
8    >
9      <div style="height:100px;">
10        <v-card-subtitle v-if="selectedBook == null">
11          登録したい書籍を検索してください
12        </v-card-subtitle>
13        <template v-if="selectedBook != null">
14          <v-row style="text-align:center;">
15            <v-col cols="6" class="pa-5">
16              <img :src="image(selectedBook)">
17            </v-col>
18            <v-col cols="4" class="pa-5">
19              <v-card-title>{{ title(selectedBook) }}</v-card-title>
20              <v-card-subtitle class="pa-3">
21                {{ authors(selectedBook) }}
22              </v-card-subtitle>
23            </v-col>
24          </v-row>
25        </template>
26      </div>
27      <BookPostText />
28      <v-divider
29        class="ma-7"
30      />
31      <v-row
32        justify="center"
33        class="ma-5"
34      >
35        <v-btn
36          color="success"
37          class="ma-2"
38          @click="postBook"
39        >
40          登録する
41        </v-btn>
42        <v-btn
43          class="ma-2"
44          depressed
45          @click="clearBook()"
46        >
47          やめる
48        </v-btn>
49      </v-row>
50    </v-card>
51  </v-container>
52</template>
53<script>
54import bookInfo from '~/plugins/bookInfo.js'
55
56export default {
57  mixins: [bookInfo],
58  data () {
59    return {
60    }
61  },
62  computed: {
63    selectedBook () {
64      return this.$store.state.selectedBook
65    }
66  },
67
68  methods: {
69    // 本の選択の解除
70    clearBook () {
71      this.$store.commit('clearBook')
72    },
73    postBook () {
74      this.$axios.$post('/api/v1/posts', {
75        post: {
76          title: this.selectedBook.title,
77          author: this.selectedBook.author,
78          image: this.selectedBook.image
79        }
80      })
81        .then(response => this.$store.commit('userBook', response))
82    }
83  }
84}
85</script>
86<style scoped>
87img {
88  height: 120px;
89}
90</style>

bookInfo
1import noImage from '~/assets/images/noImage.png'
2export default {
3  methods: {
4    title: valu => valu.volumeInfo.title ? valu.volumeInfo.title : 'No title',
5    authors: valu => valu.volumeInfo.authors ? valu.volumeInfo.authors[0] : 'No authors',
6    image: valu => valu.volumeInfo.imageLinks ? valu.volumeInfo.imageLinks.thumbnail : noImage
7  }
8}
9

store
1export const state = () => ({
2  books: [],
3  selectedBook: null,
4  userBook: []
5})
6
7export const mutations = {
8  // 本情報
9  getBooks (state, res) {
10    state.books = res.data.items
11  },
12  // 選択した本
13  selectedBook (state, book) {
14    state.selectedBook = book
15  },
16  // 選択解除
17  clearBook (state) {
18    state.selectedBook = null
19  },
20  // 登録する本
21  userBook (state, response) {
22    state.userBook = response
23  }
24}
25