ページにアクセスしたときにお勧めを表示したい。(jsonから取得し、Vue.jsで表示）

前提・実現したいこと

Vue.jsでお勧めを表示するページを作りたいです。

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

うまく表示できない

該当のソースコード

html
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="UTF-8" />
5    <title>Cakes!</title>
6    <link rel="stylesheet" href="Cakes.css" />
7    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
8    <script src="cakes.js"></script>
9  </head>
10  <body>
11    <div id="cakesApp">
12
13      <div class="searchArea">
14        <img class="logo" src="logo.png">
15        <div class="space"></div>
16        <input class="searchBox" type="text" v-model="input">
17        <button type="button" v-on:click="searchCakeByName">検索</button>
18      </div>
19
20      <div class="dispArea" v-if="recommend.show == false">
21        <div class="cake" v-for="cake in cakes" v-bind:key="cake.id">
22          <p class="cakeTitle">{{ cake.title }}</p>
23          <img class="cakeImage" v-bind:src="cake.image">
24        </div>
25      </div>
26
27      <div class="topArea" v-if="recommend.show == true">
28        <h3>今週のお勧め</h3>
29        <div class="cake" v-for="cake in cakes" v-bind:key="cake.id">
30          <p class="cakeTitle">{{ cake.title }}</p>
31          <img class="cakeImage" v-bind:src="cake.image">
32          <p class="cakeExplan">{{ cake.explanation }}</p>
33        </div>
34      </div>
35
36    </div>
37  </body>
38</html>
39

javascript
1window.onload = Main;
2
3let cakesApp;
4const baseURL = "http://localhost:3000/cakes";
5
6function Main() {
7  cakesApp = new Vue({
8    el: "#cakesApp",
9    data: {
10      input: "",
11      recommend: {
12        recommend.show: true;
13        }
14      },
15      cakes: []
16    },
17    methods: {
18      searchCakeByName: function(event) {
19        let url = "?title_like=" + this.input;
20        url = baseURL + encodeURI(url);
21        updateData(url);
22      }
23    },
24    mounted: function(event) {
25      updateData(baseURL);
26    }
27  });
28}
29
30function updateData(url) {
31  fetch(url, { method: 'GET' })
32  .then(function(response) {
33    return response.json();
34  })
35  .then(function(res) {
36    if(Array.isArray(res)) {
37    cakesApp.cakes = res;
38    console.log(cakesApp.cakes);
39    }
40    else {
41      cakesApp.cakes = [res];
42    }
43  });
44}
45

json
1{
2  "cakes": [
3    {
4      "id": 1,
5      "title": "アイス01",
6      "image": "images/ice1.jpg",
7      "recommend": "true",
8      
9    },
10    {
11      "id": 2,
12      "title": "アイス02",
13      "image": "images/ice2.jpg",
14      "recommend": "false",
15      
16    }