你的位置:首页 > 软件开发 > Java > vue单页面程序

vue单页面程序

发布时间:2016-09-27 17:00:18
gitHub地址:https://github.com/lily1010/vue_singlePage举个栗子:<!DOCTYPE html><html> <head> <meta charset="UTF-8&quot ...

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

举个栗子:

<!DOCTYPE html><html>  <head>    <meta charset="UTF-8">    <title></title>    <script src='/images/loading.gif' data-original="js/vue-router.js" type="text/javascript" charset="utf-8"></script>    <script src='/images/loading.gif' data-original="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单页面程序

关键词:VUE

VUE
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。