user399974
user399974

Reputation: 1

How can i get properties from template

Can i get properties from template before send request to server about the data? Here's my template:

<box-component inline-template>
<div>
    <div class="loading" v-if="Loading">  Loading ...  </div>
    <div  v-if="Result">
        <ul>
            <li> {{ Result.FirstProp }} </li>
            <li> {{ Result.FourthProp }} </li>
        </ul>
    </div>
</div>

And this is my component:

let BoxComponent = {
data() {
    return {            
        Result: null,
        Loading: true
    };
},
created: function () {
    this.Update();
},
methods: {
    Update: function () {
        this.Loading = true;    
        axios.post("#SERVER_URL#")
            .then(response => {
                this.Loading = false;
                this.Result = response.data;
            });
         }
}
}
 Vue.component('box-component', BoxComponent);

It's works fine! The problem is the server response contain much more data. Server response:

{
    "FirstProp": "first",
    "SecondProp": "second"
     ...
    "HundredthProp": "hudredth"
}

I can't modify the response (other project use this too). But if i am able to send property list from the template (which are in this case FirstProp and FourthProp) the server side give me the filtered response which contains only these properties becouse the optimal response look like this:

{
    "FirstProp": "first",
    "FourthProp": "fourth"
}

So, the question is: how can i do that?

Can i find it in the Vue object?

I can load template as a string variable, but i want to avoid regex hack.

Update:

In this case, BoxTemplate call server side without "filters"

This is the optimal case, when js get the variables, that the template use, and call with them the server side. In this case, in the response there are only that variables, what template really use

Upvotes: 0

Views: 429

Answers (1)

webprogrammer
webprogrammer

Reputation: 2477

I don't know how is set up your back-end but you can have additional property within your data:

data() {
    return { 
        listOfProperty: [
            'FirstProp',
            'FourthProp',
        ],
...

And use list of it to send data to server.

Upvotes: 1

Related Questions