Use string with this keyword in vuejs or javascript

Question

I have code something like this.

  new Vue({
  el:'#app',
  data:{
    cars:[
      {
        name:'',
        make:''
      }
    ]
  },
  methods:{
    addToArray(nameOfTheArray){ //here nameOfTheArray is the string "cars"
      //so here I have to do something like this
      this.cars.push({
         name:'',
        make:''
      })
 }
  }
})

My question is can I use that argument(nameOfTheArray) to tell in which array I want to push this object. I mean something like this?

 this.nameOfTheArray.push({
         name:'',
        make:''
      })

but this doesn't work. is there any way to use that string argument with this keyword??

Yest, just use it like an array. this[nameOfTheArray].push — Luis felipe De jesus Munoz
– Luis felipe De jesus Munoz, Commented Mar 16, 2018 at 20:50
also, you method should be addToArray: function(nameOfTheArray){ — Luis felipe De jesus Munoz
– Luis felipe De jesus Munoz, Commented Mar 16, 2018 at 20:52

Max Ferreira · Accepted Answer · 2018-03-16 20:53:52Z

1

use this :

  new Vue({
  el:'#app',
  data:{
    cars:[
      {
        name:'',
        make:''
      }
    ]
  },
  methods:{
    addToArray(nameOfTheArray){ 
      this[nameOfTheArray].push({
         name:'',
         make:''
      })
 }
  }
})

answered Mar 16, 2018 at 20:53

Max Ferreira

7561 gold badge6 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

DobleL · Accepted Answer · 2018-03-16 21:08:36Z

You can access to an object property by obj[key], also check if the key exists in the object to avoid runtime errors

 new Vue({
  el:'#example',
  data:{
    cars:[
      {
        name:'',
        make:''
      }
    ]
  },
  methods:{
    addToArray(nameOfTheArray){
      if (nameOfTheArray in this) {
        this[nameOfTheArray].push({
         name: 'default name',
         make: 'default make'
        })
      } else {
        alert('Invalid key!')
      }
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.15/vue.js"></script>

<div id="example">
  <button type="button" @click="addToArray('cars')">Add to cars</button>
  <button type="button" @click="addToArray('invalidKey')">Add invalidKey</button>
  
  {{ cars }}
</div>

Collectives™ on Stack Overflow

Use string with this keyword in vuejs or javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related