vue.js에서 점프 페이지를 만드는 방법

Vue.js는 점프 페이지 메소드를 구현합니다. 1. [] 태그를 사용하여 점프합니다. 2. 매개변수가 하나만 있는 경우 점프 주소를 나타냅니다. . 매개변수를 추가하여 값을 전달할 수 있습니다.

【관련 추천 글 : vue.js】

vue.js 페이지 점프 구현 방법 :

하단 책장을 클릭하시면 해당 페이지로 이동합니다

<router-link :to="{name: &#39;bookshelf&#39;, params: { entityId: this.entityId } }"
             :class="{&#39;flex-item-1&#39;:&#39;flex-item-1&#39;,cur:tabs[0].isShow}" href="javascript:">
              <span class="tabNav-ico tabNav-book"></span>
              <span class="tabNav-txt">书 架</span>
</router-link>

'이름' : 'bookshelf'는 점프할 Vue 컴포넌트의 이름을 나타냅니다. 이름은 라우터 파일 아래 index.vue에 설정됩니다.

{
     path: '/bookshelf',
     name: 'bookshelf',
     component: Bookshelf
   },

params: {entityId: this.entityId}에는 전달할 매개변수가 포함되어 있습니다.

bookshelf 구성 요소에서 매개변수 수신

this.bookshelfId = this.$route.params.entityId;this.bookshelfId = this.$route.params.entityId;

除了使用标签进行跳转，还可以使用下面的方法

<a @click="toIndex" :class="{&#39;flex-item-1&#39;:&#39;flex-item-1&#39;,cur:tabs[2].isShow}" href="javascript:">
      <span class="tabNav-ico tabNav-home"></span>
      <span class="tabNav-txt">首 页</span>
</a>
toIndex: function(){
        this.$router.push("/?entityId="+ localStorage.getItem("entityId"));
}

同样可以跳转页面，this.$router.push()方法只有一个参数的时候，代表跳转地址，还可以增加一个参数传值。

写法：

this.$router.push({name: "deepReadingDetail", params: {'id': data.id, 'title': data.title}});

接收参数：

this.$route.params.title

라벨을 사용하여 이동할 수도 있습니다. 다음 메소드를 사용하세요.

rrreee

this.$router.push() 메소드에 매개변수가 하나만 있는 경우 점프 주소를 나타내는 매개변수를 추가하여 값을 전달할 수도 있습니다. 작성:

rrreee

수신 매개변수: 🎜🎜this.$route.params.title🎜🎜🎜관련 무료 학습 권장 사항: 🎜javascript🎜(동영상) 🎜🎜

위 내용은 vue.js에서 점프 페이지를 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!