Javascript 在vue中获取数据属性

我在v-for循环中有这样一个选择表单：

<div class="select">
    <select v-model="shippingMethod">
        <option value="{{shipping.id}}" v-for="shipping in shippingMethods" data-price="{{ shipping.amount}}">{{shipping.description}} - {{shipping.amount / 100}}</option>
    </select>
    <div class="select__arrow"></div>
</div>

---

我可以获得所选选项的新值。问题是我还需要数据价格值。我怎样才能得到它？

运送方法是数组吗？如果是这样，您可以传递数组索引

{{index}

，而不是将

{{shipping.id}}

作为

值传递。然后，在您的
updateTotal
方法中，您可以使用
this.shippingMethods[this.shippingMethod]
访问当前选项

整个事情看起来是这样的：

updateTotal: function(event){
    console.log(this.shippingMethod);
},

<div class="select">
<select v-model="shippingMethod">
    <option value="{{index}}" v-for="(shipping, index) in shippingMethods" data-price="{{ shipping.amount}}">{{shipping.description}} - {{shipping.amount / 100}}</option>
</select>
    <div class="select__arrow"></div>
</div>


updateTotal: function(event){
    console.log(this.shippingMethods[this.shippingMethod]);
},


{{shipping.description}-{{shipping.amount/100}
updateTotal:函数（事件）{
log（this.shippingMethods[this.shippingMethod]）；
},
装运方法是阵列吗？如果是这样，您可以传递数组索引
{{index}
，而不是将
{{shipping.id}}
作为
值传递。然后，在您的
updateTotal
方法中，您可以使用
this.shippingMethods[this.shippingMethod]
访问当前选项

整个事情看起来是这样的：

updateTotal: function(event){
    console.log(this.shippingMethod);
},

<div class="select">
<select v-model="shippingMethod">
    <option value="{{index}}" v-for="(shipping, index) in shippingMethods" data-price="{{ shipping.amount}}">{{shipping.description}} - {{shipping.amount / 100}}</option>
</select>
    <div class="select__arrow"></div>
</div>


updateTotal: function(event){
    console.log(this.shippingMethods[this.shippingMethod]);
},


{{shipping.description}-{{shipping.amount/100}
updateTotal:函数（事件）{
log（this.shippingMethods[this.shippingMethod]）；
},
是，这是Vue 1.0，并且
配送
是一个数组。如果我这样做
配送。金额
和
配送。说明
不起作用，控制台未定义。值在inspector中类似于此：
-NaN
是这是Vue 1.0，并且
配送
是一个数组。如果我这样做
配送。金额
和
配送。说明
不起作用，控制台未定义。值在inspector中如下所示：
-NaN