<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta name="viewport" content="width=device-width, initial-scale=1.0">

     <meta http-equiv="X-UA-Compatible" content="ie=edge">

     <title>Document</title>

     <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>

     <script src="https://cdn.bootcss.com/vue-router/3.0.2/vue-router.js"></script>

 </head>

 <body>

     <div id="hdcms">

         <router-link to="/hdphp">HDPHP</router-link>

         <router-link to="/hdcms">HDCMS</router-link>

         <router-view></router-view>

     </div>

     <script>

         const hdphp={

             template:'<h1>hdphp</h1>'

         }

         const hdcms={

             template:'<h1>hdcms</h1>'

         }

          let  routes=[

                 {path:'/hdphp',component:hdphp},

                 {path:'/hdcms',component:hdcms},

             ]

         let route = new VueRouter({

             routes:routes

         });

         new Vue({

             el:'#hdcms',

             router:route

         });

     </script>

 </body>

 </html>

vue route的更多相关文章

  1. 深入浅出的webpack4构建工具--webpack4+vue+route+vuex项目构建(十七)

    阅读目录 一:vue传值方式有哪些? 二:理解使用Vuex 三:webpack4+vue+route+vuex 项目架构 回到顶部 一:vue传值方式有哪些? 在vue项目开发过程中,经常会使用组件来 ...

  2. vue route.go 载入刷新

    vue route 重新载入刷新: this.$router.go({path : 'path' , query: { param: this.param} })

  3. Vue Route Building the UI back-end framework

    Vue 的 路由就像ASP.NET MVC路径相似. 路由定义文件也是js格式的,我们都将这些文件放入到src的route文件中. 后台框架主入口: <template> <div ...

  4. Vue route的使用

    1.route.js文件 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const router = ne ...

  5. Vue route部分简单高级用法

    一改变页面title的值   在开发时常常需要在切换到不同页面时改变浏览器的title值,那么我们就可以在定义路由的时候通过配置 meta 属性 来改变title值. import Vue from ...

  6. Vue:$route 和 $router 的区别

    参考: https://uzshare.com/view/788446 https://router.vuejs.org/zh/ $route 是“路由信息对象”,包括 path,params,has ...

  7. vue route 跳转

    index.js { path: '/grouporder/grouporderdetail/id/:id', name: '/grouporder/grouporderdetail/id/', co ...

  8. 借助 Vue 来构建单页面应用

    原文: https://github.com/MeCKodo/vue-tutorial 主题 Vue.js (1/2)Vue构建单页应用最佳实战 前言 我们将会选择使用一些vue周边的库 1.使用no ...

  9. Vue.js的库，包，资源的列表大全。

    官方资源 外部资源 社区 播客 官方示例 入门 开发工具 语法高亮 代码片段 自动补全 组件集合 库和插件 路由 ajax/数据 状态管理 校验 UI组件 i18n 示例 模板 脚手架 整合 插件/指 ...

随机推荐

  1. QLineSeries QChartView 生成折线

    效果图 // 创建折线上点的序列 QLineSeries *splineSeries = new QLineSeries(); //QSplineSeries *splineSeries = new ...

  2. Win10系列：C#应用控件基础19

    ScrollViewer控件 ScrollViewer控件包含一个水平和一个竖直滚动条以及一个可滚动的内容显示区域,在显示区域内可以放置其他可见控件.ScrollViewer控件的水平和垂直滚动条两端 ...

  3. 实验楼高级bash脚本编程指南 挑战：简单的热身

    传送门:https://www.shiyanlou.com/courses/running# 步骤一 新建一个 test.sh 输出 Hello Shiyanlou! 步骤二 复制 test.sh 为 ...

  4. MySQL配置文件my.ini或my.cnf的位置

    1.Windows下MySQL的配置文件是my.ini,一般会在安装目录的根目录. 2.Linux下MySQL的配置文件是my.cnf,一般会放在/etc/my.cnf,/etc/mysql/my.c ...

  5. Ubuntu Desktop 编译 ffmpeg (简略的写写)

    关于ffmpeg FFmpeg是一個自由軟體,可以執行音訊和視訊多種格式的錄影.轉檔.串流功能,包含了libavcodec——這是一個用於多個專案中音訊和視訊的解碼器函式庫,以及libavformat ...

  6. java基础（1）IntelliJ IDEA入门和数组操作 解决idea启动速度慢--配置JVM

    一. IntelliJ IDEA入门 1 快捷键和技巧 智能补全代码,比如只写首字母按回车: psvm+Enter :public stactic void main(String[] args) s ...

  7. char * p = "abc"与const char *p = "abc"

    char * p = "abc"与const char *p = "abc"的区别是什么呢? 第一个语句会产生问题: warning: deprecated c ...

  8. cocos2dx为Sprite添加触摸事件监听器

    1.首先头文件定义事件处理的函数原型 private: bool onTouchBegan(Touch* tTouch,Event* eEvent);//手指按下事件 void onTouchMove ...

  9. 19/03/30Python笔记

    一.三元运算 a = 1 if (条件) else a = 2 #如果条件成立,a = 1,否则a = 2 二.文件的处理 1.读取 f = open("user.txt",&qu ...

  10. Linux 下安装FastDFS v5.08 的php扩展

    php扩展也需要依赖于FastDFS一些库文件,所以请先安装FastDFS,具体请看我之前的文章.   一.安装目录 php安装目录 /data/nmp/php FastDFS源码目录 /data/w ...