Ionic 在vue中使用路由器链路的正确数据

9lowa7mx  于 2023-01-28  发布在  Ionic
关注(0)|答案(2)|浏览(174)

我试图创建一个组件,将动态改变离子按钮上的链接的基础上传递的 prop 。
我有

<template>
<ion-button router-link :to "`$/+ {{subLink1}}" shape="round">{{linkName1}}</ion-button>
</template>

<script>
import{IonButton} from '@ionic/vue'
export default{
props:{subLink1:{required:true},linkName1:{required:true}}
}
</script>

从父节点传入的属性是例如subLink1:"销售",链接名称1:"销售"
然而,控制台返回的是空白,我有什么传入,所以我想问题出在我的路由器链接?

nr9pn0ug

nr9pn0ug1#

这样做:

<ion-button 
   :router-link="`/${subLink1}`" 
   router-direction="forward" 
   shape="round" 
   v-text="linkName1"
/>

RTM:https://ionicframework.com/docs/vue/navigation#navigating-using-router-link

zpjtge22

zpjtge222#

设置href属性;

<template>
    <ion-button :href="`/${subLink1}`" shape="round">{{linkName1}}</ion-button>
</template>

<script>
import { IonButton } from '@ionic/vue'
export default{
    props: {
        subLink1:{
            required: true
        },
        linkName1: {
            required: true
        }
    }
}
</script>

相关问题