Vue数据集输出未定义

Question

我试图将对象的值和索引传递给vue方法。我的方法能够显示该值，但索引未定义。请告知我做错了什么。

JAVASCRIPT：

<div class="select is-info">

    <select @change="change_default_canvas($event.target.value, 

       $event.target.dataset.index)" id="select_business_model_version">

       <option>Select Version</option>

       <option v-for="(history,index) in all_business_models_hisotry" :key="index" :value="history.canvas_id" :data-index="index">Date : {{history.date_submitted}}</option>

    </select>

</div>

$event.target.dataset.index 正在输出 undefined

Answer 1

您需要访问选定的选项元素并从那里获取数据索引。像这样的东西：$event.target.options[$event.target.selectedIndex].dataset.index

Answer 2

将您更改@change为以下内容：<select @change="change_default_canvas" id="select_business_model_version">您的change_default_canvas方法将如下所示：change_default_canvas(event) {&nbsp; &nbsp; console.log(event.target.value)&nbsp; &nbsp; console.log(event.target.dataset.index)&nbsp; &nbsp; /* your logic here */}