v-repeat is not working with v-if in parent div - vue.js

Question

I have a conditional div which will be available for user when selected. Inside that div, I need to show a drop down menu using v-repeat.
The problem is - v-repeat is not working with that v-if in parent div. When I remove v-if, it's showing data perfectly. But when use v-if, it's not working.
Moreover, there is no error in console log.
<div class="ui blue segment" v-if="client.legal_status == 'C'">
<h3 class="ui dividing header">Rappresentante legale</h3>
<div class="inline fields">
<div class="two wide field">
<label>Nome e Cognome</label>
</div>
<div class="seven wide field">
<input type="text" placeholder="Nome" name="rep_firstname" v-model="client.rep_firstname" />
</div>
<div class="seven wide field">
<input type="text" placeholder="Cognome" name="rep_lastname" v-model="client.rep_lastname" />
</div>
</div>
<div class="inline fields">
<div class="two wide field">
<label>Indirizzo</label>
</div>
<div class="fourteen wide field">
<input type="text" placeholder="Indirizzo" name="rep_address" v-model="client.rep_address" />
</div>
</div>
<div class="inline fields">
<div class="two wide field">
<label>CAP</label>
</div>
<div class="two wide field">
<input type="text" placeholder="CAP" name="rep_zip_code" v-model="client.rep_zip_code" />
</div>
<div class="two wide field">
<label>Città</label>
</div>
<div class="four wide field">
<input type="text" placeholder="Città" name="rep_city" v-model="client.rep_city" />
</div>
<div class="two wide field">
<label>Prov.</label>
</div>
<div class="four wide field">
<div id="rep_provinces-dropdown" class="ui search selection dropdown">
<input type="hidden" name="rep_province_id" v-model="client.rep_province_id">
<i class="dropdown icon"></i>
<div class="default text">Provincia</div>
<div class="menu">
<div class="item" v-repeat="province: provinces" data-value="#{{province.id}}">
<span class="description">#{{province.id}}</span> #{{province.name}}
</div>
</div>
</div>
</div>
</div>
<div class="inline fields">
<div class="two wide field">
<label>Cellulare</label>
</div>
<div class="six wide field">
<input type="text" placeholder="Cellulare" name="rep_mobile" v-model="client.rep_mobile" />
</div>
<div class="two wide field">
<label>Email</label>
</div>
<div class="six wide field">
<input type="text" placeholder="Email" name="rep_email" v-model="client.rep_email" />
</div>
</div>
</div>
how can I fix it?