vue 단 추 를 누 르 면 간단 한 페이지 전환 을 실현 합 니 다.

본 논문 의 사례 는 vue 버튼 을 누 르 면 페이지 전환 을 실현 하 는 구체 적 인 코드 를 공유 하여 여러분 께 참고 하 시기 바 랍 니 다.구체 적 인 내용 은 다음 과 같 습 니 다.

<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
 <title></title>
 <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
 </head>
 <body>
 <div id="app">
  <h3 v-show="tab==1">   </h3>
  <h3 v-show="tab==2">   </h3>
  <h3 v-show="tab==3">   </h3>
  
  
  <button @click="tabChange" data-id="1">  </button>
  <button @click="tabChange" data-id="2">   </button>
  <button @click="tabChange" data-id="3">   </button>
 </div>
 <script type="text/javascript">
  let app = new Vue({
  el:"#app",
  data:{
   tab:1
  },
  methods:{
   tabChange:function(e){
   let tabid = e.target.dataset.id
   this.tab = tabid
   }
  }
  })
 </script> 
 </body>
</html>
이거 쓰 려 면 vue.js 다운 받 으 세 요.

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기