이 응용 프로그램에 버튼이 있고 다른 Vue 파일로 변경하고 싶습니다. 첫 번째 Vue 파일은 app.vue입니다.
<template>
<div id="app">
<button id="gettingStarted">Getting started</button>
</div>
</template>
<script>
export default {
name: 'App',
components: {
}
}
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
#gettingStarted {
font-family: Avenir, Helvetica, Arial, sans-serif;
background:cornflowerblue;
border-radius: 0.5rem;
height: 2.5rem;
width: 6%;
}
</style>
그런 다음 Gallery.vue라는 다른 파일이 있습니다.
<template>
<div id="app">
<h4>25%</h4>
</div>
</div>
</template>
<script>
export default {
name: 'App',
components: {
}
}
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
버튼에서 in-app.vue를 클릭하고 gallery.vue로 이동하고 싶습니다. 현재이 프로젝트에 Vue3를 사용하고 있습니다.
언제든지 Vue Router를 사용할 수 있습니다.
이 튜토리얼은 나보다 더 잘 설명 할 것입니다.
https://appdividend.com/2018/12/28/vue-router-tutorial-with-example-how-to-use-routing-in-vuejs
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다