質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.12%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

受付中

Vue Router で画面遷移ができない。

futuv1234
futuv1234

総合スコア14

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

2回答

0リアクション

0クリップ

184閲覧

投稿2022/09/20 06:56

前提

Vue 3
Vite

実現したいこと

Vue Routerを用いて画面遷移をしたい。

該当のソースコード

./router.ts

import { createRouter, createWebHistory } from 'vue-router' import Test from './components/test.vue' const routes = [ { path: '/test', component: Test } ] const router = createRouter({ history: createWebHistory(), routes }) export default router

./main.ts

import { createApp } from 'vue' import router from './router' import App from './App.vue' createApp(App).use(router).mount('#app')

./App.vue

<template> <router-link to="/test">Testページへ</router-link> </template>

現在の状態

画面にリンクは表示され押下した時ブラウザのURLは記載したものに変わるのですが、画面が遷移されません。
Chromeの開発者ツールのコンソールではエラーや警告は発生していません。

解決方法のご教授をお願いいたします。

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

macaron_xxx

2022/09/20 07:34

フォルダ構成とファイルを明記してください。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.12%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。