Vuexの値をtemplate内で使用するとエラー

前提・実現したいこと

GoogleBooksAPIから書籍情報を取得してpage内で表示させていましたが、書籍情報を使い回したいと考えVuexを使用することにしました。
私のイメージでは

①　クリック(getBook)されるとtemplate内のkeywordがVuexのkeywordに格納されて書籍情報を取得する
②　axiosで取得した書籍情報がstoreの配列(books)に格納される
③　store内の書籍情報ををtemplate内のbooks配列に格納する
③　template内のbooks配列をv-forで取り出して表示する

なのですが、エラーがでてうまくいきません。

発生している問題・エラーメッセージ

該当のソースコード

~/store/index.js

Vuex
1const BASE_URL = 'https://www.googleapis.com/books/v1/volumes?q='
2
3export const state = () => ({
4  books: [],
5  keyword: ''
6})
7
8export const mutations = {
9  getBooks (state, res) {
10    state.books = res.data.items
11  },
12  getKwyword (state, keyword) {
13    state.keyword = keyword
14  }
15
16}
17
18export const actinons = {
19  async getBookAction ({ commit }) {
20    await this.$axios.$get(BASE_URL + state.keyword + '&maxResults=15')
21      .then((res) => {
22        commit('getBooks', res)
23      })
24  }
25}
26

~/page/search.vue

Vue
1<template>
2  <div class="teal lighten-1 background pa-10">
3          <v-container>
4            <v-card>
5              <v-card
6                v-for="book in books"
7                :key="book.id"
8                >
9                <div class="d-flex flex-row mb-3 pa-5">
10                  <img :src="image(book)">
11                  <div>
12                    <v-card-title>{{ title(book) }}</v-card-title>
13                    <v-card-subtitle>{{ authors(book) }}</v-card-subtitle>
14                  </div>
15                </div>
16              </v-card>
17          </v-container>
18      </v-row>
19    </v-sheet>
20  </div>
21</template>
22<script>
23import noImage from '~/assets/images/noImage.png'
24
25export default {
26  data () {
27    return {
28      keyword: '',
29      books: [],
30    }
31  },
32
33  computed: {
34    getBooks () {
35      return this.$store.state.books
36    }
37  },
38
39  methods: {
40   
41    get () {
42      this.$store.commit('getKeyword', this.keyword)
43      this.$store.dispatch('getBookAction')
44    },
45
46    // APIリクエスト後の処理
47    setBooks (res) {
48      this.books = this.$state.books
49    },
50
51    // 取得した書籍データの設定
52    title: valu => valu.volumeInfo.title ? valu.volumeInfo.title : 'No title',
53    authors: valu => valu.volumeInfo.authors ? valu.volumeInfo.authors[0] : 'No authors',
54    image: valu => valu.volumeInfo.imageLinks ? valu.volumeInfo.imageLinks.thumbnail : noImage
55  }
56}
57</script>
58