vue 主要功能代码

1. 路由：

html
router-link 触发的超链接，底层会转成a标签
router-view 相当于ng-view

js
    1、定义组件(不要注册)
    2、创建路由对象，设置路由规则（注册组件到路由中）
        目的:触发了谁，把谁展示出来 
    3、把我们上面创建好的路由对象，注入到根实例 (new Vue({}))

App.vue:
<router-link to="/home"><el-menu-item index="1">首页</el-menu-item></router-link>
<router-link to="/financial"><el-menu-item index="2">理财中心</el-menu-item></router-link>

<router-view></router-view>

main.js:
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
import home from './components/home/home.vue'
import mine from './components/mine/mine.vue'
const router = new VueRouter({
routes: [
{ path: '/', component: home },
{ path: '/home', component: home },
{ path: '/mine', component: mine }
]
})
new Vue({
el: '#app',
router,
render: h => h(App)
})

---

2. 抽离子组件

subcomponents-->subswipe.vue
在home.vue或其他组件中使用subswipe.vue,

home.vue

<template>
<div>
<subswipe lunbo_url="api/getlunbo" :lunbo_time="3000"></subswipe>
</template>
</div>
<script>
//导入子组件
import subswipe from '../subcomponents/subswipe.vue'

export default { //相当于 module.exports = {}
    data() {
        return {       
        }
    },
    components:{//注册
        subswipe
    }
}

</script>

---

3.