我是 Vue 新手,我正在使用這個下拉菜單組件(https://ej2.syncfusion.com/vue/documentation/drop-down-list/data-binding/)從 json 數組中提取列表項看起來像這樣:<template> <div id="app"> <div id='container'> <ejs-dropdownlist id='dropdownlist' placeholder='Pick a name' :dataSource='images' :fields='fields'></ejs-dropdownlist> </div> <img v-for="image in images" :key="image.url" :src="require('@/assets/pics/' + image.url)"> </div></template><script> export default { data() { return { images: [ { id: 'm1', name: 'Sample Name', url: "../assets/pics/samplename.png" },... ], fields : {text:'name', value:'id'} } } }</script>目前所做的只是通過循環一次列出所有圖像v-for,但我想從下拉菜單中選定的名稱中獲取 id/url 并將其傳遞給標簽,<img>以便在下面僅顯示相應的圖像,我該怎么做呢?謝謝!
使用 Vue 使用下拉菜單更改 <img> src
臨摹微笑
2023-10-14 18:40:57