在写代码时，有一些无意识就触发的bug，下面就简单介绍一下本人在开发中遇到的一些bug：
1.单词写错
单词写错一般是大多数人最常出的bug了，往往有时候因为键盘敲的快而打错一个字母，就使代码运行出现问题，如果使用vscode编译代码的话就可以使用 Code Spell Checker这个插件，能够帮助我们检查单词拼写单词是否出现错误，检查的规则遵循camelCase（驼峰拼写法）。
2.文件路径写错
开发中如果引入一个文件后，运行程序没有反应，这是多半是路径出了问题，尤其是在用js实现页面跳转时，由其是js文件引入到html页面，在js文件上书写的路径需要参照html文件所处路径来引用（以html文件为根目录）。
3.文件格式错误
在nodejs中使用fs.writeFileSync()方法，往文件中添加数据时，如果出现了如下图的报错信息，不要慌，先看报错内容是什么，如果英语不好可以复制报错信息，找个翻译软件翻译一下，如果英语好的话就可以直接从其中了解到，其内容大致是说上传的参数必须是字符串或Buffer类型TypedArray或DataView的实例，此时我们就可以了解到是上传的参数的数据格式不对。
所以在我们遇到bug时不要慌，先看报错信息，毕竟有报错的bug好解决，难的是出bug了还不报错的那种。
4.字符串拼接问题
上图中可以看到，用逗号分隔开打印时，可以拿到我们想要的数据，；但是用“+”号连接时，就出现了对象obj的字符串格式，因为“+”号一边有字符串时，另外一边的数据也会被转换为字符串。
5.webpack打包问题
打包如果出现问题，看报错内容的第二行，里面有报错的详细情况
6.vue计算属性
计算属性的完整写方法
computed: {
"属性名": {
set(值){//对值进行设置
},
get() {//默认值
return "值"
}
}
}
以上报错是因为只设置了默认的get()
计算属性也是变量, 如果想要直接赋值, 需要使用完整写法=>开启读写模式
7.vue单项流数据
在vue中需要遵循单向数据流原则
- 在父传子的前提下，父组件的数据发生会通知子组件自动更新
- 子组件内部，不能直接修改父组件传递过来的props => props是只读的
特殊说明
说明：父组件传给子组件的是一个对象，子组件修改对象的属性，是不会报错的，对象是引用类型, 互相更新；但不能改变引用地址
8.vue2时间轴层异常
页面刷新，组件无法正常从Vuex中获取数据：
获取数据为空，控制台报错如下：
可能原因：ajax为异步执行，在组件内赋值时异步代码还未执行，无法获取数据。
解决方案：
- 使用第三方插件（vuex-persistedstate），将数据存入本地，在store/index.js文件中配置：
import Vue from 'vue'
import Vuex from 'vuex'
// 1. 导入包
import createPersistedState from 'vuex-persistedstate'
Vue.use(Vuex)
export default new Vuex.Store({
// 2. 配置为 vuex 的插件
plugins: [createPersistedState()],
state: {
token: ''
},
mutations: {
updateToken(state, newToken) {
state.token = newToken
}
}
})
- 利用定时器
methods: {
initUserForm () {
setTimeout(() => {
console.log(this.$store.state.userInfo)
this.userForm = { ...this.$store.state.userInfo }
}, 500)
}
},
created () {
this.initUserForm()
}
