摘要：最近在前端开发的过程中踩了不少坑，先记录下来，往后整理路由实例更新里每一次进行路由导航，对应路由的组件都会生成一个新的实例简称，不注意这一点话会掉坑。原因就是此时路由中的不再是第一次创建监听时指向的了。
最近在前端开发的过程中踩了不少坑，先记录下来，往后整理
路由实例更新vue.js里每一次进行路由导航，对应路由的vue.js组件都会生成一个新的vue实例(简称vm)，不注意这一点话会掉坑。
比如在/home路由里，在mounted()中，我在window下监听了一个键盘事件，为了避免事件重复绑定多次，我设立一个全局变量来标记创建的状态，只有第一次进入时才创建监听事件。
if(!window.keyupFlag){
let myFunc = ()=>{console.log(this.$refs.input1)}; //这里用箭头函数能直接在函数内拿到指向当前的vm的this
window.addEventListener("keyup",myFunc);
window.keyupFlag = 1;
}
但是这样会导致一个问题，在我跳转到别的路由，比如/about后在跳转回/home，我在myFunc函数中this.$refs.input1就会返回undefined。
原因就是此时/home路由中的vm不再是第一次创建监听时this指向的vm了。
那么转换思路，改成每次进入/home都创建监听事件，且在创建前先清除之前创立的事件。
以及要注意的是，清除事件的target.removeEventListener(type, listener[, options]);，其中传入的参数要和创建时的一致，且type和listener这两个参数都是必须的，具体的可以参阅MDN文档
这里我选择用vuex来保存监听的回调函数
let myFunc = ()=>{console.log(this.$refs.input1)};
let oldMyFunc = this.$store.state.myFunc; //第一次进入/home时这里还没有被myFunc赋值,第二次进入路由时就有正确的值了
window.removeEventListener("keyup",oldMyFunc);
window.addEventListener("keyup",myFunc);
this.$store.commit("setMyFunc",myFunc);
使用Axios发起POST请求时，产生OPTIONS请求问题
原因是跨域发起复杂请求时，按照新的标准浏览器会先发起一个预检请求OPTIONS请求来测试请求是否能被服务器接受，如果服务端对此没有相应的处理，就会出现请求失败的问题。
具体的方案待施工，先丢几个参考
http://www.ruanyifeng.com/blo...
https://juejin.im/post/5c68b2...
https://segmentfault.com/a/11...
相关的教程很多，但是有两点鲜有提及
授权服务端要设置请求中的回调域名或ip地址
当使用code来请求access_token时，发起的请求头Header中要设置"Authorization": ...,
具体的Authorization值可能不同的服务端会有区别，我的项目中用的是
//BASE64编码字符串"clientId:clientSecret" "Basic " + window.btoa(clientId + ":" + clientSecret);
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/104996.html
摘要：本文近日施工中与各位分享近期笔者写一个较繁复的轮子的过程，以及其中的踩坑与思考。拿常用的库作比较的话，这个库性质类似这种辅助的工具库，这种范式有函数式和响应式编程的味道，具体是属于数据流编程的一种。 （本文近日施工中...） 与各位分享近期笔者写一个较繁复的轮子的过程，以及其中的踩坑与思考。若有更佳实践，还望不吝赐教。 要素察觉：目录结构， git 分支策略， TS 与 Lint ，多...
摘要：在互联网时代，建筑业数据的价值和重要性将逐步体现，充分运用大数据制定企业发展战略进行战略决策。此外，在智慧城市智能建筑方面需要大量采用物联网技术。1． 大数据技术大数据是以容量大、类型多、存取速度快、应用价值高为主要特征的数据集合。建筑业是产生大量数据的行业之一，又是数据电子化程度较低的行业。在互联网＋时代，建筑业数据的价值和重要性将逐步体现，充分运用大数据制定企业发展战略、进行战略决策。研...
摘要：踩坑记录前端请求如果携带信息，那么后端不能为知识点前端发出的请求如果是附带身份验证而后端的如果设置的是那么这个请求会失败，在预请求时会被拦截下来。来源文档踩坑记录在一个文件上传的接口出现问题。 踩坑记录-前端请求如果携带Cookie信息，那么后端Access-Control-Allow-Origin不能为* 知识点 前端发出的请求如果是附带身份验证（withCredentials：tr...
摘要：本文主要针对小程序无聊广场的前端开发内容做总结，记录常见的一些老生常谈的进阶手法，对小程序中的动画音频等踩坑做出解决方案。 背景 一个交互不复杂，对刷新频率和动画效果要求不高的小游戏，不需要使用canvas主导的解决方案，使用dom操作一样可以完成。节省了cocos creater的学习成本，值得一试。本文主要针对小程序无聊广场的前端开发内容做总结，记录常见的一些老生常谈的进阶手法，对...
阅读 1854·2021-11-15 11:46
阅读 1051·2021-10-26 09:49
阅读 1794·2021-10-14 09:42
阅读 3353·2021-09-26 09:55
阅读 810·2019-08-30 13:58
阅读 992·2019-08-29 16:40
阅读 3430·2019-08-26 10:27
阅读 583·2019-08-23 18:18
