vue中如何動(dòng)態(tài)拼接this后面的變量
更新時(shí)間：2023年07月05日 14:33:39 作者：起啥名呢啊
這篇文章主要介紹了vue中如何動(dòng)態(tài)拼接this后面的變量問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
vue動(dòng)態(tài)拼接this后面的變量
寫項(xiàng)目的用到for循環(huán)，動(dòng)態(tài)拼接變量，用了幾種方法不行，終于找到一種，記錄一下：
? ?for (let i = 1; i <= 4; i++) {
? ? ? ? let data = { RequestType: "Get", portNumber: i + "" };
? ? ? ? console.log(i);
? ? ? ? console.log(this["Str" + i]); ? ?
? ? ? ? this.$axios
? ? ? ? ? .post("/api/config/dev", data)
? ? ? ? ? .then((res) => {
? ? ? ? ? ? let data = res.data;
? ? ? ? ? ? this["Str" + i][1].xinxi = data.subtemperature; // 子設(shè)備溫度1
? ? ? ? ? })
? ? ? ? ? .catch((error) => {
? ? ? ? ? ? console.log(error);
? ? ? ? ? });
? ? ? }直接在this后面加[]，在里面添加你要拼接的內(nèi)容！
親測(cè)有效!!!
react、vue動(dòng)態(tài)拼接key（動(dòng)態(tài)拼接key或者其他參數(shù)）
react動(dòng)態(tài)拼接
這里拿到的拿到的這個(gè)值‘roomDisabled’是一個(gè)字符串，并不是一個(gè)變量的值，
解決辦法：
{this.state[${type}Disabled]}例子：
vue動(dòng)態(tài)拼接
let addRoom = '新增';
let editRoom = '修改';
let key='Room';
console.log('test',this['addRoom'],this['editRoom'],this[`add${[this.key]}`])
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
本文總結(jié)了Vue.js中的內(nèi)置指令和自定義指令的使用方法和應(yīng)用場(chǎng)景,內(nèi)置指令包括v-bind、v-model、v-on、v-if/v-else/v-else-if、v-show、v-for、v-cloak和v-pre等,感興趣的朋友跟隨小編一起看看吧2025-10-10
詳解Vue用axios發(fā)送post請(qǐng)求自動(dòng)set cookie
本篇文章主要介紹了Vue用axios發(fā)送post請(qǐng)求自動(dòng)set cookie，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-05-05
對(duì)vuejs的v-for遍歷、v-bind動(dòng)態(tài)改變值、v-if進(jìn)行判斷的實(shí)例講解
今天小編就為大家分享一篇對(duì)vuejs的v-for遍歷、v-bind動(dòng)態(tài)改變值、v-if進(jìn)行判斷的實(shí)例講解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-08-08
vue路由$router.push()使用query傳參的實(shí)際開發(fā)使用
在vue項(xiàng)目中我們用函數(shù)式編程this.$router.push跳轉(zhuǎn),用query傳遞一個(gè)對(duì)象時(shí)要把這個(gè)對(duì)象先轉(zhuǎn)化為字符串,然后在接收的時(shí)候要轉(zhuǎn)化為對(duì)象,下面這篇文章主要給大家介紹了關(guān)于vue路由$router.push()使用query傳參的實(shí)際開發(fā)使用,需要的朋友可以參考下2022-11-11
Vue+Element ui 根據(jù)后臺(tái)返回?cái)?shù)據(jù)設(shè)置動(dòng)態(tài)表頭操作
這篇文章主要介紹了Vue+Element ui 根據(jù)后臺(tái)返回?cái)?shù)據(jù)設(shè)置動(dòng)態(tài)表頭操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2020-09-09
vue使用百度地圖報(bào)錯(cuò)BMap?is?not?defined問題及解決
這篇文章主要介紹了vue使用百度地圖報(bào)錯(cuò)BMap?is?not?defined問題及解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了vue自定義加載指令的相關(guān)知識(shí)，主要包括創(chuàng)建加載組件，創(chuàng)建指令的方法，結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),需要的朋友可以參考下2022-06-06
這篇文章主要為大家詳細(xì)介紹了vue v-model表單控件綁定的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
文章詳細(xì)介紹了如何封裝和使用Vue模擬鍵盤組件,涵蓋了組件封裝方法以及使用技巧,還提供了擴(kuò)展方法,如新增鍵盤類型和添加動(dòng)畫效果,并強(qiáng)調(diào)了事件處理、響應(yīng)式設(shè)計(jì)和無障礙支持的關(guān)鍵點(diǎn),需要的朋友可以參考下2025-10-10
vue3.2自定義彈窗組件結(jié)合函數(shù)式調(diào)用示例詳解
這篇文章主要為大家介紹了vue3.2自定義彈窗組件結(jié)合函數(shù)式調(diào)用示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09