首页 > 代码库 > vue单页面程序

vue单页面程序

gitHub地址:https://github.com/lily1010/vue_singlePage

举个栗子:

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script src="http://www.mamicode.com/js/vue-router.js" type="text/javascript" charset="utf-8"></script>        <script src="http://www.mamicode.com/js/vue.js" type="text/javascript" charset="utf-8"></script>        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />    </head>    <body>        <div id="app">            <a class="list-group-item" v-link="{ path: ‘/home‘}">Home</a>            <a class="list-group-item" v-link="{ path: ‘/about‘}">About</a>            <router-view></router-view>        </div>        <template id="home">            <h1>                我是home            </h1>        </template>        <template id="about">            <h1>                我是about            </h1>        </template>        <script type="text/javascript">            //声明使用路由            Vue.use(VueRouter);                         var home = Vue.extend({                template: "#home"            })            var about = Vue.extend({                template: "#about"            })                        //创建路由            var router = new VueRouter();                        //映射路径            router.map({                ‘/home‘:{component:home},                ‘/about‘:{component:about}            })                        //启动路由            var app = Vue.extend({});            router.start(app,"#app");        </script>    </body></html>

vue单页面程序