Here I am using vue form generator. Here my question is I have written v-if condition for many categories. In the same way I have many vue form generator component where I have written v-if condition. So I am facing performance issue here. So my question is if we are writing such condition like this. so this could be the reason for performance or anything else.
<div v-if="(category == 'Real Estate | Single Family Homes')||(category == 'Real Estate | Town Homes')||(category == 'Real Estate | Condominiums')||(category == 'Real Estate | Multi Family')||(category == 'Real Estate | Mobile Homes')||(category == 'Real Estate | Farm/Ranch Land')||(category == 'Real Estate | Commercial Property')||(category == 'Real Estate | Foreclosures')||(category == 'Real Estate | Storage')||(category == 'Real Estate | Vacation Property')||(category == 'Real Estate | Open Houses')||(category == 'Real Estate | Other Properties')">
<vue-form-g :schema="schema_Real_Estate" :model="model" :options="formOptions"></vue-form-g>
<span class="prev_next">
<button class="prev_next_btn" @click.prevent="prev()">Previous</button>
<button style="background-color:lightgray;" class="prev_next_btn" @click.prevent="next(2)">Next</button>
</span>
</div>
Top comments (1)
Not sure why exactly there would be a performance issue with that but I would definitely add all that to an array and do a v-if="validCategories.includes(category)" to make it more clean or .indexOf(category) !== -1 or even your own function that will do partial matches just looking for "Real Estate" if that is what you're actually looking for.