Demers94
3 years ago
1614
5
Vue

Pass arguments to computed properties

Posted 3 years ago by Demers94

Here's what I'm trying to do : I want to show or hide an element (using v-show ) depending on wether or not the result of a function is true. I've tried passing a method as the parameter between the {{ }}for output, but the problem with it is that it won't re-render if the values change.

I've read about ways to force Vue to re-render, and everytime someone points to computed properties. The problem is, I need to loop through soem items and paste the current iteration as an argument to that computed propery, and it's not working.

Here's the code that I'm using to display the HTML :

<div v-for="(option, values) in facets">
    <ul>
        <li v-for="(value, count) in values">
            <button class="btn btn-sm btn-default" @click="toggleFacetValue(option, value)">{{ value }}   ( {{ count }} )</button>
            <strong v-show="isActive(option, value)">Active</strong>
        </li>
    </ul>
</div>

And here is my computed property :

computed:{
    isActive: function(option, value){
        return true;
    }
},

Is there a way to achieve what I want? In this case I'm just returning true for testing purposes, but I'll need to do some processing to the arguments and return true or false depending on the result.

It works the first render if I make isActive() a method and not a computed property, but then it won't re-render when the values change.

Please sign in or create an account to participate in this conversation.