VueJs + Element UI：如何使用照片el-select设置默认值？

Question

我选择带照片的选项，在选项中我可以获得照片变量，但在默认值下，我无法通过照片获得最终价值。

你可以帮帮我吗？

预计：默认值为麦当劳（照片+标签）

这里是我的代码：

<el-select v-model="value" placeholder="Select">
   <el-option v-for="item in outlet" :key="item.value" :label="item.label" :value="item.value">
     <img :src="item.photo"> {{ item.label }}
   </el-option>
</el-select>

这是我的小提琴：

https://jsfiddle.net/dede402/L4y8zw1e/10/

Answer 1

选定的值模板和选项模板是不同的。 el-select允许您为所选模板定义前缀插槽，请查看：https://jsfiddle.net/budgw/L4y8zw1e/36/

请注意，我更改了您的el-select，以便直接使用对象作为选定值。在这种情况下，您必须在value-key上指定el-select。