vue问题罗列
（1）学完局部注册和全局注册的差别后，你再看看main.js的new Vue代码，你应该懂得了
这是因为：你的入口main.js中，仅仅注册了一个全局组件App.vue
绑定在html上的一个叫#app的元素上
也就是说，你的所有组件，都是在App.vue下活动的子组件。
而子组件的切换，是通过url来切换的？如何切换呢？是通过路由来监听切换的
基本上就是这样的原理。
（3）如果不能看到源码来修复bug真心累。除非是通过场景重现的bug。否则定位不到错误行很惨。所以需要开启map。在 /config/index.js 中，修改 productionSourceMap 为 true 即可。
（4）Vue访问localhost:8080端口失败
在浏览里输入：localhost:8080，运行起来后的效果却是如下图所示：
尝试过关掉防火墙、打开指定端口、检查端口没有被占用都没有解决问题。查阅很多博客也没有找到相关问题，所有的博客或是文档都是到这步就成功了或者有其他的报错。后面我想到用ip打开页面会怎样？用这一思路解决了该问题。
将项目目录下config文件下的index.js中的host: 'localhost'改成host: '192.168.2.165'
再执行cnpm run dev
在浏览里输入：192.168.2.165:8080，运行起来后的效果却是如下图所示：
（5）关于URL地址http://localhost:8080/#/后面的/#/
路由的hash和history之分，默认是hash模式，会有#，把mode改成history。
对于vue开发的单页面应用，我们在切换不同的页面的时候，可以发现html永远只有一个，这也真是称之为单页面的原因，而vue-router 默认 hash 模式—— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。因为对于正常的页面来说，更换url一定是会导致页面的更换的， 而只有更换url中的查询字符串和hash值得时候才不会重新加载页面。 这里也就是这个道理。
但是#这种形式真的很丑！ 所以，如果不想要，可以使用路由的history模式！！！ 这种模式充分利用了history.pushState API来完成URL的跳转而不需要重新加载页面。
router/index.js文件：
const router = new VueRouter({
mode: 'history',
routes: [...]
})
使用这种模式之后，就没有#了，而是可以像使用正常的url进行访问了。 建议还是先使用#的方式进行开发
注意：这么做以后，你的服务器就不再返回 404 错误页面，因为对于所有路径都会返回 index.html 文件。为了避免这种情况，你应该在 Vue 应用里面覆盖所有的路由情况，然后在给出一个 404 页面。
const router = new VueRouter({
mode: 'history',
routes: [
{ path: '*', component: NotFoundComponent }
]
})
（6）$mount
数据挂载：在实例化Vue的时候，两种方式挂载数据
var app=new vue({
el:"#app",
data(){
...
}
})
注：文档中最常用的做法就是直接在实例化的时候利用el:"#app"来挂载元素
方法二：$mount
var app=new vue({
data(){
...
}
})
app.$mount("#app")
注：利用$mount挂载的方法有一个很大的好处，就是将实例化的内容和他对HTML的关联分开，可以更直观的展现。
（7）由于HTML特性，不区分大小写，所以当使用DOM模板时，驼峰命名的props名称要转为短横线分隔命名
（8）安装vue-cli时，需要在管理员权限下进行，不然容易报错，出现一些不必要的麻烦。即进入管理员权限后，运行
cnpm install -g vue-cli
（9）改变props情况
改变prop的情况：
①作为data中局部数据的初始值使用；②作为子组件中的computed属性。
（10）v-for指令中的key值作用
更新已渲染过的元素列表时，默认使用就地复用策略。若删除第一条数据，vue不会重新生成新元素，而是复用第一个元素，则添加在第一个元素上的样式将不会被清除，甚至会影响页面展示效果。未了给vue一个提示，以便其能够跟踪每个节点的身份，需要为每项提供一个唯一key属性。
（11）组件间的通信
组件是独立作用域的实例，组件可复用，展示不同数据的时候，需要给组件传入数据。
组件内部的状态改变不会影响其他组件，父组件要关心子组件状态，使用自定义事件监听。
父组件->子组件 使用prop传递参数
子组件->父组件 使用自定义事件监听状态变化
（12）组件间通信：
父组件要给子组件传递数据，子组件需要将它内部发生的事情告知给父组件。
父组件->子组件：
组件实例的作用域是孤立的，不能在子组件直接用父组件的数据。
父组件向子组件传递数据时，可以在组件上使用自定义属性绑定数据，在组件中需要显示的用props声明自定义属性。
子组件->父组件：
子组件向父组件传递数据时，需要用到自定义事件，父组件用$on监听自定义事件，$emit触发父组件所关心的自定义事件。
父组件用v-on用来监听子组件的事件是否触发了来作出相应的处理。
ps:父组件通过props向下传递数据给子组件，子组件通过events给父组件传递消息。父组件通过自定义属性向子组件传递时，需要显示声明props：["attrName"]。
子组件通过$emit(event,[...args])方法触发当前实例上的事件，把事件沿着作用域链向上传递，直到父组件接收到该事件作出相应反应。
（13）ESLint验证
有的时候用vue-cli创建好项目之后，写代码时会出现换行和空格报错，出现这么写错误是什么原因呢？
相信第一次接触时有点摸不着头脑。其实是在你用vue-cli脚手架构建项目时用了ESLint代码检查工具，如下图
解决方案很多种，最简单就是在创建项目初始化时，在这个选项选择N即可。 其他方法见vue工程化之去除Eslint验证
（14）报错提示
index.js?bed3:161 [WDS] Errors while compiling. Reload prevented. index.js？bed3：161 [WDS]编译时出错。 重新加载被阻止
原因：import引用的文件路径不对
.
浙公网安备 33010602011771号