我在我的项目中使用Vuetify 3 + Inertia/vue 1 + vite 4。有很多vuetify元素,如v-btn
或v-card
,需要链接到其他页面。
当我使用这些元素的href
prop 时,链接将不是惯性链接,当用户单击它们时,页面将完全重新加载。我尝试在Inertia中使用Link
元素的as
prop ,如下所示:
import {VBtn} from "vuetify/components";
...
<Link :href="route('home')" as="VBtn">Home</Link>
HTML结果:<vbtn>Home</vbtn>
我也试过:
import {VBtn} from "vuetify/components";
...
<Link :href="route('home')" as="{VBtn}">Home</Link>
结果:Uncaught (in promise) DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('{VBtn}') is not a valid name.
我也试过这个:
<Link :href="route('home')" as="{v-btn}">Home</Link>
结果:Uncaught (in promise) DOMException: Failed to execute 'createElement' on 'Document': The tag name provided ('{v-btn}') is not a valid name
我还尝试将vuetify元素嵌入到<link>
元素中,但这会导致无效的HTML(例如标签中的标签)并破坏vuetify组件的样式。
1条答案
按热度按时间72qzrwbm1#
也许如果你直接使用VBtn组件而不是Link元素:
也可以帮助你的VBtn文档https://vuetifyjs.com/en/api/v-btn/