first commit

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/App.vue

@@ -0,0 +1,18 @@
+<template>
+  <div id="app">
+    <img src="./assets/logo.png">
+    <a href="#/">首页</a>
+    <a href="#/about">关于我</a>
+    <router-view/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'App'
+}
+</script>
+
+<style>
+
+</style>

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/components/HelloWorld.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="hello">
+    <h1>{{ msg }}</h1>
+    <h2>Essential Links</h2>
+    <ul>
+      <li>
+        <a
+          href="https://vuejs.org"
+          target="_blank"
+        >
+          Core Docs
+        </a>
+      </li>
+      <li>
+        <a
+          href="https://forum.vuejs.org"
+          target="_blank"
+        >
+          Forum
+        </a>
+      </li>
+      <li>
+        <a
+          href="https://chat.vuejs.org"
+          target="_blank"
+        >
+          Community Chat
+        </a>
+      </li>
+      <li>
+        <a
+          href="https://twitter.com/vuejs"
+          target="_blank"
+        >
+          Twitter
+        </a>
+      </li>
+      <br>
+      <li>
+        <a
+          href="http://vuejs-templates.github.io/webpack/"
+          target="_blank"
+        >
+          Docs for This Template
+        </a>
+      </li>
+    </ul>
+    <h2>Ecosystem</h2>
+    <ul>
+      <li>
+        <a
+          href="http://router.vuejs.org/"
+          target="_blank"
+        >
+          vue-router
+        </a>
+      </li>
+      <li>
+        <a
+          href="http://vuex.vuejs.org/"
+          target="_blank"
+        >
+          vuex
+        </a>
+      </li>
+      <li>
+        <a
+          href="http://vue-loader.vuejs.org/"
+          target="_blank"
+        >
+          vue-loader
+        </a>
+      </li>
+      <li>
+        <a
+          href="https://github.com/vuejs/awesome-vue"
+          target="_blank"
+        >
+          awesome-vue
+        </a>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HelloWorld',
+  data () {
+    return {
+      msg: 'Welcome to Your Vue.js App'
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h1, h2 {
+  font-weight: normal;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/main.js

@@ -0,0 +1,17 @@
+
+import Vue from 'vue'
+import App from './App'
+import router from './router'
+import axios from 'axios'
+
+Vue.config.productionTip = false
+// 挂载进Vue中变成全局变量
+Vue.prototype.$http = axios
+
+/* eslint-disable no-new */
+new Vue({
+  el: '#app',
+  router,
+  components: { App },
+  template: '<App/>'
+})

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/page/about.vue

@@ -0,0 +1,18 @@
+<template>
+  <div class="about">
+    {{ title }}
+  </div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      title: '我的'
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/page/home.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="home">
+    {{ title }}
+    <ul>
+      <li v-for="(item,index) in list" :key="index">
+        <img :src="item.img_src" alt="">
+        <p>{{ item.title }}</p>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data () {
+    return {
+      title: '首页',
+      list: []
+    }
+  },
+  created () {
+    this.getHomeData()
+  },
+  methods: {
+    async getHomeData () {
+      var res = await this.$http.get('http://192.168.31.100:3000/api/json/index')
+      console.log(res.data)
+      this.list = res.data.result.list
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>

历届学生/front-end-team/项目练习/学生项目/缪虎/vuecli2/src/router/index.js

@@ -0,0 +1,19 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+
+Vue.use(Router)
+
+export default new Router({
+  routes: [
+    {
+      path: '/',
+      name: 'home',
+      component: () => import(/* webpackChunkName: "home" */ '@/page/home')
+    },
+    {
+      path: '/about',
+      name: 'about',
+      component: () => import(/* webpackChunkName: "about" */ '@/page/about')
+    }
+  ]
+})