diff --git a/src/components/Recommandation.vue b/src/components/Recommandation.vue
index d95801f..8566878 100644
--- a/src/components/Recommandation.vue
+++ b/src/components/Recommandation.vue
@@ -2,7 +2,7 @@
   <div class="listpage recommandataions pictureView">
     <div class="listpage-content">
       <div class="listpage-header">
-        <el-switch v-model="viewMode" active-text="海报" active-value="picture" inactive-text="列表" inactive-value="list"></el-switch>
+        <el-switch v-model="viewMode" active-text="海报" active-value="picture" inactive-text="列表" inactive-value="list" @change="updateViewMode"></el-switch>
         <el-button @click.stop="updateEvent" icon="el-icon-refresh">更新推荐</el-button>
       </div>
       <div class="listpage-body" id="recommandataions-table" v-show="viewMode === 'list'">
@@ -91,7 +91,7 @@
 </template>
 <script>
 import { mapMutations } from 'vuex'
-import { history, recommandation } from '../lib/dexie'
+import { history, recommandation, setting } from '../lib/dexie'
 import zy from '../lib/site/tools'
 import Waterfall from 'vue-waterfall-plugin'
 // import { recommandations as buildInRecommandations } from '../lib/dexie/initData'
@@ -255,10 +255,22 @@ export default {
           return b.detail.year - a.detail.year
         })
       })
+    },
+    getViewMode () {
+      setting.find().then(res => {
+        this.viewMode = res.recommandationViewMode
+      })
+    },
+    updateViewMode () {
+      setting.find().then(res => {
+        res.recommandationViewMode = this.viewMode
+        setting.update(res)
+      })
     }
   },
   created () {
     this.getRecommandations()
+    this.getViewMode()
   }
 }
 </script>
diff --git a/src/components/Setting.vue b/src/components/Setting.vue
index e1c3b5a..243d866 100644
--- a/src/components/Setting.vue
+++ b/src/components/Setting.vue
@@ -210,17 +210,7 @@ export default {
     },
     getSetting () {
       setting.find().then(res => {
-        this.d = {
-          id: res.id,
-          theme: res.theme,
-          shortcut: res.shortcut,
-          view: res.view,
-          externalPlayer: res.externalPlayer,
-          searchAllSites: res.searchAllSites,
-          excludeRootClasses: res.excludeRootClasses,
-          excludeR18Films: res.excludeR18Films,
-          forwardTimeInSec: res.forwardTimeInSec
-        }
+        this.d = res
         this.setting = this.d
       })
     },
diff --git a/src/lib/dexie/dexie.js b/src/lib/dexie/dexie.js
index 2e3e621..1b4e51c 100644
--- a/src/lib/dexie/dexie.js
+++ b/src/lib/dexie/dexie.js
@@ -6,7 +6,7 @@ const db = new Dexie('zy')
 db.version(4).stores({
   search: '++id, keywords',
   iptvSearch: '++id, keywords',
-  setting: 'id, theme, site, shortcut, view, externalPlayer, searchAllSites, excludeRootClasses, excludeR18Films, forwardTimeInSec, starViewMode',
+  setting: 'id, theme, site, shortcut, view, externalPlayer, searchAllSites, excludeRootClasses, excludeR18Films, forwardTimeInSec, starViewMode, recommandationViewMode',
   shortcut: 'name, key, desc',
   star: '++id, [key+ids], site, name, detail, index, rate, hasUpdate',
   recommandation: '++id, [key+ids], site, name, detail, index, rate, hasUpdate',
diff --git a/src/lib/dexie/initData.js b/src/lib/dexie/initData.js
index 846c730..8960161 100644
--- a/src/lib/dexie/initData.js
+++ b/src/lib/dexie/initData.js
@@ -9,7 +9,8 @@ const setting = [
     excludeRootClasses: true,
     excludeR18Films: true,
     forwardTimeInSec: 5,
-    starViewMode: 'picture'
+    starViewMode: 'picture',
+    recommandationViewMode: 'picture'
   }
 ]