vue data中如何獲取使用store中的變量

更新時(shí)間：2022年03月30日 11:57:27 作者：herry-弟弟

這篇文章主要介紹了vue data中如何獲取使用store中的變量，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

data獲取使用store中的變量

我們想使用定義在store中的全局變量，總是獲取不到為空或是undefined，其實(shí)很簡(jiǎn)單：

比如我們調(diào)用后端接口時(shí)需要用到用戶id，那么我們首先要獲取store中定義的userId

方法如下：

1.這是store中定義的屬性（我們獲取用戶id為例）

在這里插入圖片描述

2.直接在想要使用的當(dāng)前頁(yè)面的computed中進(jìn)行獲取

在這里插入圖片描述

3.然后就直接可以通過(guò)this.userid進(jìn)行使用，比如我獲取完之后為了驗(yàn)證一下在created中打印了一下，結(jié)果如下：

在這里插入圖片描述

無(wú)法獲取$store中的變量問(wèn)題

需求是向后端傳登陸用戶的ID，寫(xiě)成this.$store.user.userID，

結(jié)果后端沒(méi)收到，原來(lái)是少寫(xiě)了一個(gè)state

改為this.$store.state.user.userID后正常。

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Vue CLI4.0 webpack配置屬性之productionSourceMap用法
這篇文章主要介紹了Vue CLI4.0 webpack配置屬性之productionSourceMap用法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
2024-06-06
vue router解決路由帶參數(shù)跳轉(zhuǎn)時(shí)出現(xiàn)404問(wèn)題
我的頁(yè)面是從一個(gè)vue頁(yè)面router跳轉(zhuǎn)到另一個(gè)vue頁(yè)面,并且利用windows.open() 瀏覽器重新創(chuàng)建一個(gè)頁(yè)簽,但是不知道為什么有時(shí)候可以有時(shí)候又不行,所以本文給大家介紹了vue router解決路由帶參數(shù)跳轉(zhuǎn)時(shí)出現(xiàn)404問(wèn)題,需要的朋友可以參考下
2024-03-03
vue設(shè)置全局變量5種方法(讓你的數(shù)據(jù)無(wú)處不在)
這篇文章主要給大家介紹了關(guān)于vue設(shè)置全局變量的5種方法,通過(guò)設(shè)置的方法可以讓你的數(shù)據(jù)無(wú)處不在,在項(xiàng)目中經(jīng)常會(huì)復(fù)用一些變量和函數(shù),比如用戶的登錄token,用戶信息等,這時(shí)將它們?cè)O(shè)為全局的就顯得很重要了,需要的朋友可以參考下
2023-11-11
vuex + axios 做登錄驗(yàn)證并且保存登錄狀態(tài)的實(shí)例
今天小編就為大家分享一篇vuex + axios 做登錄驗(yàn)證并且保存登錄狀態(tài)的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-09-09
Vue3中slot插槽基本使用
插槽slot可以說(shuō)在一個(gè)Vue項(xiàng)目里面處處都有它的身影，比如我們使用一些UI組件庫(kù)的時(shí)候，我們通?？梢允褂貌宀蹃?lái)自定義我們的內(nèi)容，這篇文章主要介紹了Vue3中slot插槽使用方式,需要的朋友可以參考下
2022-08-08
Vue.js Ajax動(dòng)態(tài)參數(shù)與列表顯示實(shí)現(xiàn)方法
Vue.js是一個(gè)輕巧、高性能、可組件化的MVVM庫(kù)，同時(shí)擁有非常容易上手的API。下面通過(guò)本文給大家介紹vue.js ajax動(dòng)態(tài)參數(shù)與列表顯示實(shí)現(xiàn)方法，感興趣的朋友一起看看吧
2016-10-10
vue請(qǐng)求函數(shù)和路由的安裝使用過(guò)程
這篇文章主要介紹了vue請(qǐng)求函數(shù)和路由的安裝使用過(guò)程,本文給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧
2024-08-08
關(guān)于element el-input的autofocus失效的問(wèn)題及解決
這篇文章主要介紹了關(guān)于element el-input的autofocus失效的問(wèn)題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-12-12
vue 項(xiàng)目集成 electron 和 electron 打包及環(huán)境配
文章介紹了如何使用Vue和Electron開(kāi)發(fā)桌面端應(yīng)用,包括安裝Electron、配置package.json、創(chuàng)建main.js文件、運(yùn)行和打包應(yīng)用等步驟,并分享了一些常見(jiàn)的打包錯(cuò)誤及其解決方法,感興趣的朋友一起看看吧
2025-01-01
Elementui?el-input輸入框校驗(yàn)及表單校驗(yàn)實(shí)例代碼
輸入框是使用非常多的元素,用來(lái)輸入用戶名、密碼等等信息,Element提供了功能和樣式豐富的輸入框,下面這篇文章主要給大家介紹了關(guān)于Elementui?el-input輸入框校驗(yàn)及表單校驗(yàn)的相關(guān)資料,需要的朋友可以參考下
2023-06-06