vue에서 화면이동하기

원래는 a태그 이동이나 버튼이벤트에서는 href로 화면을 이동했다. 

하지만 vue에서는 href로 하면 되지않는다...

 

a태그

a태그에서는 v-bind를 이동해야한다.

<template>

<a v-bind:href="link">이동하기</a>

 

<script>

data () {

   link = '이동하고자 하는 주소'

}

<template>

<a v-bind:href="link">이동하기</a>



<script>

data () {

   link = '이동하고자 하는 주소'

}

template

script

Button

버튼에서는 router를 이용해야한다. 

<template>

<button v-on:click="link">버튼으로 이동하기<button>

 

<script>

methods: {

    link: function (event){

                    this.$router.push('/main')

     }

}

<template>
<button v-on:click="link">버튼으로 이동하기<button>



<script>
methods: {
    link: function (event){
         this.$router.push('/main')
     }
}

으로 하면 localhost/main으로 이동할 수있다!