Vue仿CNODE社区（单页面）

1. 在 APP.vue 中引入外部文件时，注意路径的大小写问题（会警告或者报错）
2. 给元素添加 v-for = 'item in list' 后再标签内添加 key 可以解决复用问题，在后边循环标签中使用 item
3. <router-link :to="{name:'xxx'}"></router-link> （一定要加引号）
4. 在 Vue 中引入 Axios 时要将 Axios 添加到 Vue 原型中使用 Vue.prototype.$http=Axios （‘http’为自定义）
5. 过滤器（全局）放在 Vue 实例的上边，以防止出警告
6. 动态绑定属性时，一定要加 v-bind: 如：<img :src='xxx'> <div :class='xxx'></div>
7. v-bind 绑定属性时，数组语法和对象语法可混用
   对象语法：键====>类名、值====>布尔值
8. 在各组件的输出（export）中， data 必须是方法
9. switch (xxx) {case 'aaa' ; bbb ; break;........} 选择符合xxx的那一项，要记得加 break官方文档
10. arr.splice( index , howmany , item1 , ...... , itemn) index：开始的索引；howmany：删除多少个（可为0）；itemn：添加的新元素
11. @click='方法名' 不带()时，即不带参数时，传入 methods 中的参数是 event 事件
12. 子组件向父组件传递数据时，<div @Fn1='Fn2'></div> ，Fn1是子组件发布的订阅模式的函数名， Fn2 是父组件定义的方法名
13. this.$http.get(xxxxx,${this.$router.params.id}) （跳转到该组件路由中时传入的参数，对应的文章）
14. beforeMount：生命周期钩子，在挂在开始之前调用，在渲染之前（渲染器件不被调用）。本例中用于获取 API 数据啊
15. 在同一页面中，两个组件同时存在，组件 B 存在组件 A 的跳转路由，这时点击组件 B 中路由时，路由发生改变，但是页面不会重新渲染，这时就需要使用到监听器，监听路由的变化，如：

watch : {
  $router : function ( to , from ) {
    this.getArticle() //路由改变时，重新获取数据
  }
}

各组件间的跳转，通过路由传入路径、参数以达到路由不同

16. 路由配置（必须引入，输出）哪个组件使用到路由就引入哪组件。输出：

export default new Router ({
  routes : [{ //定义路由
    name : 'article',
    path : '/topic/:id&author=:name', //跳转路径。动态绑定 router-link 传来的参数
    component : { //使用组件
     main : Article, //跳转到组件
     slide : Slidebar
    }
  }]
})

在组件中使用路由时（Postlist）：

<router-link :to="{ //跳转到。。。
  name : 'article', //跳转到 name 为 article 组件
  params : { //路由跳转是传入的参数
    id : item.id, //跳转的组件为路由中的参数与路由中path 对应
    name : item.author.loginname
  }
}"></router-link>

Vue 项目在 Git 部署方法

1.更改路径，即 config 目录下的 index.js 文件，修改 build （不是dev）改为 assets PublicPath : './'

2. npm run build 生成 dist 文件夹
   若字体图标无法显示，打开根目录下 build 中 utils.js 在控制 build 样式文件代码中添加 PublicPath : '../../' if (options.extract){xxx, PublicPath : '../../'} 在重新 npm run build
3. 在 .gitignore 中忽略列表中去除 /dist/