首页 > 解决方案 > VueJs 在选择选项中设置自定义属性值

问题描述

我正在使用带有 laravel 的 vuejs .. 我想要的是像这样访问名为 price 的自定义属性..

<select name='unit[]' required @change='change_unit($event)'>
    <option v-for='(unit) in line.units' price='66'  :value='unit.get_unit_id.id'>@{{unit['get_unit_id']['name']}}</option>
</select>

这是vuejs代码

change_unit:function(event)
{
    let get_val = event.target.selectedOptions[0].getAttribute("price");
    console.log("Value from the Attribute: ", get_val)
}

像这样,一切都很好..但我的问题是,当我想根据 v-for 设置价格时..

<option v-for='(unit) in line.units' price='unit.price' >

在控制台中,我输入文本'unit.price'而不是实数来自循环中的 v-for .. 那么如何根据 unit.price 设置属性价格 .. 谢谢..

标签: jquerylaravelvue.js

解决方案


您需要绑定price属性。绑定属性

<option v-for='(unit) in line.units' :price='unit.price'>

推荐阅读