VueJSセレクトボックスが動的にポピュレートされているときに反応しない

Question

状況選択ボックスの値をcustomer.lStatusに設定する必要があります。ただし、 の手作業で HTMLを書かない限り、選択ボックスは値で更新されません。何？

スクリプト

<script> 
// ... 
data() { 
    return { 
    customer: { 
     dLastUpdate: '2016-02-17 15:07:06', 
     lKey: '1007', 
     lLastUpdateBy: '1000', 
     lStatus: '100015', 
     sName: 'TestAgain' 
    }, 
    statuses: [ 
     [100013, 'Active'], 
     [100015, 'Deactivated'], 
     [100012, 'On Hold'], 
     [100014, 'On Notice'], 
     [100011, 'Pending'] 
    ] 
    }; 
}, 
// ... 
</script> 

<select class="form-control" v-model="customer.lStatus"> 
    <option v-for="status in statuses" value="status[0]">{{status[1]}}</option> 
</select> 

ワークスは動作しません

<select class="form-control" v-model="customer.lStatus"> 
    <option value="100013">Active</option> 
    <option value="100015">Deactivated</option> 
    <option value="100012">On Hold</option> 
    <option value="100014">On Notice</option> 
    <option value="100011">Pending</option> 
</select> 

Answer 1

あなたは番目のコロンが欠落していますe value属性。

試してみてください。

<select class="form-control" v-model="customer.lStatus"> 
    <option v-for="status in statuses" :value="status[0]">{{status[1]}}</option> 
</select>