CODEWITHSUNDEEP
vue.js
sy-huss
sy-huss

Reputation: 193

How can I filter the ${{ data }} object to only show specific values?

I am using vue.js and dumping my data ${{ data }} and outputing this to the user, however, I would only like to display specific values. In this instance, I want to show everything but NOT Actions.

I would only like to show: Name, Description and Method.

{
  "Name": "",
  "Description": "",
  "Actions": [
    {
      "Actions": "Microsoft.AAD/domainServices/oucontainer/write"
    },
    {
      "Actions": "Microsoft.AAD/domainServices/oucontainer/delete"
    },
    {
      "Actions": "Microsoft.AAD/domainServices/oucontainer/read"
    }
  ],
  "Method": "a,b,c,d,"
}

Upvotes: 0

Views: 41

Answers (1)

rakesh shrestha
rakesh shrestha

Reputation: 1455

You can create a method which will do it for you.

let first create a method where I will be using spread syntax.Check this link as well.

https://codingexplained.com/coding/front-end/vue-js/working-with-methods-in-vue-js

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!',
    actions : ["this i it", "abc"],
    lovely: "asdf"

  },
  methods : {
    getData : function(){           
        let {actions, ...dataExceptAction} = this.$data;
        return dataExceptAction;
    }
  }

})

Now I can simply use the getData method on my template

<div id="app">
  <p>{{ getData()  }}</p>
</div>

Working example of this is here https://jsfiddle.net/3cy2roLp/45/

Upvotes: 1

Related Questions