vue中如何动态拼接this后面的变量
更新时间：2023年07月05日 14:33:39 作者：起啥名呢啊
这篇文章主要介绍了vue中如何动态拼接this后面的变量问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
vue动态拼接this后面的变量
写项目的用到for循环，动态拼接变量，用了几种方法不行，终于找到一种，记录一下：
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; // 子设备温度1
})
.catch((error) => {
console.log(error);
});
}直接在this后面加[]，在里面添加你要拼接的内容！
亲测有效!!!
react、vue动态拼接key（动态拼接key或者其他参数）
react动态拼接
这里拿到的拿到的这个值‘roomDisabled’是一个字符串，并不是一个变量的值，
解决办法：
{this.state[${type}Disabled]}例子：
vue动态拼接
let addRoom = '新增';
let editRoom = '修改';
let key='Room';
console.log('test',this['addRoom'],this['editRoom'],this[`add${[this.key]}`])
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
本文总结了Vue.js中的内置指令和自定义指令的使用方法和应用场景,内置指令包括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发送post请求自动set cookie
本篇文章主要介绍了Vue用axios发送post请求自动set cookie，非常具有实用价值，需要的朋友可以参考下2017-05-05
对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解
今天小编就为大家分享一篇对vuejs的v-for遍历、v-bind动态改变值、v-if进行判断的实例讲解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
vue路由$router.push()使用query传参的实际开发使用
在vue项目中我们用函数式编程this.$router.push跳转,用query传递一个对象时要把这个对象先转化为字符串,然后在接收的时候要转化为对象,下面这篇文章主要给大家介绍了关于vue路由$router.push()使用query传参的实际开发使用,需要的朋友可以参考下2022-11-11
Vue+Element ui 根据后台返回数据设置动态表头操作
这篇文章主要介绍了Vue+Element ui 根据后台返回数据设置动态表头操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-09-09
vue使用百度地图报错BMap is not defined问题及解决
这篇文章主要介绍了vue使用百度地图报错BMap is not defined问题及解决，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
这篇文章主要介绍了vue自定义加载指令的相关知识，主要包括创建加载组件，创建指令的方法，结合实例代码给大家介绍的非常详细,需要的朋友可以参考下2022-06-06
这篇文章主要为大家详细介绍了vue v-model表单控件绑定的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-05-05
文章详细介绍了如何封装和使用Vue模拟键盘组件,涵盖了组件封装方法以及使用技巧,还提供了扩展方法,如新增键盘类型和添加动画效果,并强调了事件处理、响应式设计和无障碍支持的关键点,需要的朋友可以参考下2025-10-10
这篇文章主要为大家介绍了vue3.2自定义弹窗组件结合函数式调用示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-09-09
最新评论