深入理解基于vue-cli的vuex配置
更新時間：2017年07月24日 16:55:01 作者：zuank
本篇文章主要介紹了基于vue-cli的vuex配置，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
本文介紹了基于vue-cli的vuex配置，分享給大家，希望對大家有幫助
首先成功運行vue-cli項目
安裝vuex
cnpm i vuex --save
修改配置文件
store
新建文件夾store（與router同級）然后在store目錄下新建index.js
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
export default new Vuex.Store({
strict: process.env.NODE_ENV !== 'production',
modules: {
},
getters: {
},
actions: {
},
});
main.js
import Vue from 'vue'
import router from './router'
import store from './store'
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
router,
store
}).$mount('#app')
index.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>vue-cli</title> </head> <body> <div id="app"> <router-view></router-view> </div> </body> </html>
上面對main.js和index.html做了修改。主要是符合個人的用法，這樣的好處是根組件只有index.html（如果可以理解為組件），而不是有app.vue和index.html兩個。
直觀上來看可能這樣就會出現(xiàn)每個組件都要引一個導航欄的問題，這樣可能不太好。但是從過往的開發(fā)經(jīng)驗來看，如果在app.vue中定義了導航欄，那么相應的在app.vue中就要加入相應的業(yè)務邏輯，網(wǎng)站規(guī)模大了之后app.vue的業(yè)務邏輯會越來越多，不利于管理。（所以這里app.vue就可以刪除了）
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
這篇文章主要為大家介紹了vue?請求攔截器的配置方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-01-01
這篇文章主要介紹了vue中async-await的使用誤區(qū),本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2018-12-12
這篇文章主要介紹了手寫Vue彈窗Modal的實現(xiàn)代碼，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-09-09
本篇文章主要介紹了詳解Vue生命周期的示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03
這篇文章主要介紹了vue豎向步驟條方式,具有很好的參考價值,希望對大家有所幫助,2023-12-12
這篇文章主要介紹了Vue3請求攔截器里如何配置token,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了最適應的vue.js的form提交涉及多種插件,涉及到 vue.js動態(tài)添加css樣式 ，tab切換 ，touch，表單提交，驗證，toast，數(shù)據(jù)雙向綁定等。需要的朋友可以參考下2018-08-08
這篇文章主要介紹了vue如何給頁面增加url前綴問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-12-12
antd?select?多選限制個數(shù)的實現(xiàn)代碼
這篇文章主要介紹了antd?select?多選限制個數(shù),實現(xiàn)思路和核心代碼都很簡單，其中核心代碼在于disabled，代碼簡單易懂需要的朋友可以參考下2022-11-11
本篇文章主要介紹了在Vue中使用Compass的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03