Can we append a dynamic value to v-if condition - vue.js

Question

Based on the index value need the if condition to dynamically change and show the contents based on that.
Have 3 dropdown and when a certain value is selected from the drop down the 4 text fields need to be shown.
When I select a value from the first dropdown and meets the v-if condition then the 4 text fields are shown and when I go and select another option from the dropdown which also meets the if criteria the text fields are shown under the 2nd dropdown but fields under the 1st dropdown goes off.
<template>
<tr
v-if="(rowIndex == index && isCtlRail)"
:id="'ctlRail_'+items.id"
style="line-height:2em;"
>
<td
style="text-align:left; vertical-align:top;font-size:9pt;"
colspan="4"
>
Length:
<br>
Left Cut:
<br>
Right Cut:
<br>
Rotate 90°:
<br>
</td>
<td>
<input
id="bap_productLen"
v-model="length"
type="number"
inputmode="numeric"
value="20"
maxlength="4"
min="20"
max="5000"
>
<br>
<select
id="leftCut"
v-model="leftCutSelected"
name="leftCut"
style="font-size:10pt;"
>
<option value="45">
45°
</option>
<option value="90">
90°
</option>
</select>
<br>
<select
id="rightCut"
v-model="rightCutSelected"
name="rightCut"
style="font-size:10pt;"
>
<option value="45">
45°
</option>
<option value="90">
90°
</option>
<option value="135">
135°
</option>
</select>
<br>
<input
v-model="rotate"
type="checkbox"
:disabled="!rotateFlag"
>
</td>
</tr>
</template>
The above is the code for the 4 text fields to be shown. In the v-if condition , isCtlRail I am setting it as true when the index is 0 or 1 or 2 based on the condition check in the method. Similarly for rowIndex as well.
Tried setting dynamic value to if but condition did not work.
For eg:-
v-if="(rowIndex_+index == index && isCtlRail_+index == index)"
so that it will be specific to that particular row but did not work , always the text fields where shown under all the 3 dropdowns.
Please let me know how to proceed further.
Below is the method where I am setting the values for rowIndex
readOrdAttribute : function(value) {
console.log("Inside the readOrdAttribute function");
if(this.orderingAttribute !== undefined && this.orderingAttribute.isCTLCable === 'true')
this.isCtlCable = true;
else
this.isCtlCable = false;
if(this.orderingAttribute !== undefined && this.orderingAttribute.isCTLRail === 'true'){
//this.isCtlRail = true;
console.log("the ctrail shape is...rectangular...." + this.orderingAttribute.rail_shape);
this.railShape = this.orderingAttribute.rail_shape;
if (value === 'showDiv_1'){
//this.isCtlRail_0 = true;
this.isCtlRail_0 = '0';
this.rowIndex = '0';
this.rowIndex_0 = '0';
this.isCtlRail = true;
}
else if (value === 'showDiv_2'){
//this.isCtlRail_1 = true;
this.isCtlRail_1 = '1';
this.rowIndex = '1';
this.rowIndex_1 = '1';
this.isCtlRail = true;
console.log("value of isCtlRail_1 is " + this.isCtlRail_1 +"and rowIndex_1 is " +this.rowIndex_1);
}
else {
//this.isCtlRail_2 = true;
this.isCtlRail_2 = '2';
this.rowIndex = '2';
this.rowIndex_2 = '2';
this.isCtlRail = true;
}
}
else{
if (value === 'showDiv_1'){
console.log("value === 'showDiv_1'");
this.isCtlRail_0 = '';
this.rowIndex_0 = '';
}
else if (value === 'showDiv_2'){
console.log("value === 'showDiv_2'");
this.isCtlRail_1 = '';
this.rowIndex_1 = '';
}
else {
console.log("value === 'showDiv_3'");
this.isCtlRail_2 = '';
this.rowIndex_2 = '';
}
}
},