帶你玩轉vue——vuex的概述

前言

我們學會了使用vue工程化前端工程,那麼我們就要思考何爲工程?我認爲工程就應該是一個整體,蓋一棟大樓就是一個工程,上樓我們有上樓的工具——電梯,用電我們有輸送電力的工具——電纜。總之,我們在大樓裏享受的所有服務都有專門爲之配套的設備,他們搭配在同一個框架上形成一個工程,同樣我們的前端工程也有各種各樣的工具搭建在我們vue-cli上!而vuex是其中最重要的工具之一,它被用來管理項目中的全局變量,使工程中的每一個部分都可以相互合作從而成爲一個整體,爲開發者節省更多梳理全局變量的時間和更快捷的服務,也讓vue變得更加友好!!

vuex的地位

vuex是一個存儲全局變量的容器,其中的變量通過特定的方式被改變。同時它是整個項目的中樞系統,是項目中重要變量的管理工具。

vuex的使用場景

在沒有vue之前,我們的web項目是由一個個或html或jsp,或跳轉或嵌套iframe組成前端頁面,頁面之間相互跳轉會傳遞一堆的參數,進入頁面第一件事情就是取參,各種變量非常難以管理。
在vue工程中我們可以將一些本來在很多頁面都用到的變量、常量提取出來。比如我們的後端調用路徑,因爲前後端分離的緣故,我們的後端地址肯定是絕對路徑,如果我們沒有使用vuex去管理這個變量,當我們的後端地址發生改變的時候,我們就需要去修改每個http請求的路徑,如果我們使用了vuex,只需要在vuex文件中修改一次即可,而且可以保證沒有遺漏!!

vuex的結構

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    baseUrl: 'http://127.0.0.1:7001/imeterx/'
  },
  getters: {
  },
  mutations: {
  },
  actions: {
  }
})

預知後事如何,且聽下回分解

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章