英文:
How can I put a href property on a carousel item in Vuetify 2?
问题
我正在使用Vuetify 2,并且需要在用户点击轮播图像时将其重定向到一个网站。轮播的每个项目都应该指向不同的网站,因此需要有多个href或类似的东西。
<v-carousel>
<v-carousel-item
src="https://th.bing.com/th/id/R.1f617f6c0e62cf22f8cc0db2d56c9b28?rik=%2fsedPErWt7A%2bIA&riu=http%3a%2f%2f2.bp.blogspot.com%2f-rhsJGYj0RFc%2fUJ8G5i3UEHI%2fAAAAAAAAABg%2fQY0NlUG7lBI%2fs1600%2fwallpaper-praia-wallpapers%2b(13).jpg&ehk=AkwUJUusgP9ImnYhvxvSQ0PSTFbjvJlKlUSeikKT%2bAQ%3d&risl=&pid=ImgRaw&r=0"
cover></v-carousel-item>
<v-carousel-item src="https://th.bing.com/th/id/R.5fedcc584b436fe320057461d49f3996?rik=0iHP4CUZiAaMyQ&pid=ImgRaw&r=0" cover></v-carousel-item>
<v-carousel-item src="https://cdn.vuetifyjs.com/images/cards/sunshine.jpg" cover></v-carousel-item>
</v-carousel>
我尝试了API中提供的一些属性,但我不知道我是否正确编写了它们,或者它们在Vuetify 2中是否起作用。
英文:
I am working with Vuetify 2 and need to redirect the user to a website when he clicks on the image of the carousel, each item of the carousel should take to a different website, so it needs to have more than one href or something like that.
<v-carousel>
<v-carousel-item
src="https://th.bing.com/th/id/R.1f617f6c0e62cf22f8cc0db2d56c9b28?rik=%2fsedPErWt7A%2bIA&riu=http%3a%2f%2f2.bp.blogspot.com%2f-rhsJGYj0RFc%2fUJ8G5i3UEHI%2fAAAAAAAAABg%2fQY0NlUG7lBI%2fs1600%2fwallpaper-praia-wallpapers%2b(13).jpg&ehk=AkwUJUusgP9ImnYhvxvSQ0PSTFbjvJlKlUSeikKT%2bAQ%3d&risl=&pid=ImgRaw&r=0"
cover></v-carousel-item>
<v-carousel-item src="https://th.bing.com/th/id/R.5fedcc584b436fe320057461d49f3996?rik=0iHP4CUZiAaMyQ&pid=ImgRaw&r=0" cover></v-carousel-item>
<v-carousel-item src="https://cdn.vuetifyjs.com/images/cards/sunshine.jpg" cover></v-carousel-item>
</v-carousel>
I've tried some of the props available in the API, but I don't know if I wrote it correctly or it doesn't work in Vuetify 2
答案1
得分: 1
将每个v-carousel-item用<a>
标签包裹起来。
<a href="https://stackoverflow.com/" target="_blank">
<v-carousel-item />
</a>
英文:
Wrap each v-carousel-item with an <a>
tag.
<a href="https://stackoverflow.com/" target="_blank">
<v-carousel-item />
</a>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论