首页 > 代码库 > 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单页面程序
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。