vue-router页面导航链接示例代码
代码语言:html
所属分类:其他
代码描述:vue-router页面导航链接示例代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue-router-3.01.js"></script> <div id="app"> <h1>Hello App!</h1> <p> <!-- 使用 router-link 组件来导航. --> <!-- 通过传入 `to` 属性指定链接. --> <!-- <router-link> 默认会被渲染成一个 `<a>` 标签 --> <router-link to="/foo">Go to Foo</router-link> <router-link to="/bar">Go to Bar</router-link> </p> <!-- 路由出口 --> <!-- 路由匹配到的组件将渲染在这里 --> <router-view></router-view> </div> <script> // 0. 如果使用模块化机制编程,导入Vue和VueRouter,要调用 Vue.use(VueRouter) // 1. 定义 (路由) 组件。 // 可以从其他文件 import 进来 const Foo = { template: ` <transition name="slide"> <div class="foo">foo</div> </transition> ` } const Bar = { template: ` <transition name="fade"> <div class="bar">bar&.........完整代码请登录后点击上方下载按钮下载查看
网友评论0