問題描述

問題如下，請大神解惑

先說說我個人的理解

model層的變化會反應到view層上，view層的變化也會反映到model上。而在.vue的文件中，model層就是data對象里面的數據（此處假設不存在store倉庫），在vue中view就是template里的內容，model就是data對象中存在的數據，而類似于methods里面的方法都應該歸類在Controller層。

在mvvm這種模式暫未問世，大家寫代碼大都遵循mvc模式的，將數據，視圖，業務邏輯拆開來寫，這樣代碼也會看著清晰一點。

vuex就是一個倉庫，主要為了解決當vue多個組件共享某一個狀態，以及一些兄弟組件等通訊不便。有了vuex但不是代表要將所有的數據存放在vuex中。

說說我的問題

data(){return { userList:[], nextSwitch:true, prevSwitch:true, chooseUserId:null, linghtboxStatus:false, linghtboxImgList:[], linghtboxCurImg:’’, currentPage:1, listMaxPage:0} },mounted(){const _this = this; let Listdata = {id:this.projectId,pagesize:5,page:this.currentPage } this.$store.dispatch(’proposalListAc’,Listdata).then(function (response) {if(response.code === 200) { _this.userList = response.data.list.lists _this.listMaxPage = response.data.list.pages if(_this.listMaxPage > 1) { _this.nextSwitch = false }} })} },

其實這段代碼邏輯如下，此處我需要在組件mounted的時候，需要請求一下數據，將一個列表渲染出來，但是我這個列表的數據是這個組件中私有的，所以并不需要存在vuex中去通知其他的組件。store中的代碼如下

actions:{ proposalListAc:function(context,data){ let promise = new Promise(function(resolve,reject){api.getData(’proposalList’,data).then(function (response) { resolve(response.data);}) }) return promise}}

那么從視圖，數據，業務邏輯分離的初衷出發，這樣構造代碼是否合理？其實這個列表還有上一頁下一頁的功能，我需要構造出請求參數,來告訴服務器現在請求第幾頁的數據，請求多少條數據。功能并不難。但是我同事說，像上一頁下一頁這樣的功能屬于數據層（因為本質是是數據發生了變化），應當將這些東西放在store中。但是我的理解就是，首先我的這個列表是這個組件私有的，并不需要和其他的組件共享什么狀態。所以我僅僅是通過dispatch將請求的數據分發到頁面來，而且我在點擊上一頁，下一頁的時候需要計算currentPage，這應該是屬于業務邏輯（Controller層）,而不是model層，（雖然最終變化還是數據，但是我要通過邏輯去判斷數據應該怎么變）。請大神說說，在這種業務情況下應該怎么構造代碼比較合理，比較符合視圖，數據，業務邏輯分離的初衷，使代碼更加的優雅。（項目并不是小項目，所以引入了vuex，這塊代碼僅僅只是一小部分。stroe中有拆分了很多不同的模塊）。大家都來說說自己的理解，和意見吧

問題解答

你既然都說了是一個私有組件 肯定是內部都是計算好的 何必還要去放在store 統一管理？

你請求數據的api封裝了, 直接傳遞currentPage了就行了啊