vue.js - 显示一个对象属性值，并在悬停时显示另一个

Question

我的问题可能很难理解，所以如果你能找到更好的方法，请帮助我重新组织问题。

所以，我正在建立一个注册平台。

(1) 首先，我收到一个用户可以签到的case对象数组。

(2) 每个对象由 2 个属性组成，“名称”、“描述”。

（3）我将数组存储在数据中，最终在名为“vue-multiselect”的选择器提供的元素中使用它，它基本上接受数组并循环对象并显示它们。

(4) 如您所见，它同时显示属性和值，这是我试图避免的。我的问题是，是否可以只将“名称”值传递给选择器，并在悬停第一个值时显示描述值？

Answer 1

您可以在此处找到此用例文档：https ://vue-multiselect.js.org/#sub-custom-option-template

<multiselect v-model="value" 
             deselect-label=""
             select-label="" 
             placeholder="" 
             selected-label="" 
             :show-pointer="true"
             :options="projectCases">

    <template slot="option" slot-scope="{ option }">
        <strong :title="option.description">{{ option.name }}</strong>
    </template>
</multiselect>

ps：我使用title属性来实现悬停显示功能。您也可以使用任何其他工具提示库。