时常感叹自己“基础不牢，地动山摇”，所以最近在工作中遇到编码格式的坑，就忍不住扩展了一下，在此记录。
起因
环境： 为了seo优化，采用的静态页与vue单页结合架构的项目，涉及到一些静态页（非vue router 管辖）动态页（使用vue-router 导航）面交互的问题
业务中遇到一个问题： 某些型号通过 URI 从静态页或动态页传到动态页后自动赋值失败
分析： 通过观察发现是某些产品型号中含有（+），原来传值时是使用
encodeURI解析后通过window.location.href跳转页面，到接收参数的动态页时，加号丢失导致数据验证时验证错误，导致赋值失败
两个问题
如何解决？
为什么 加号 丢失了
解决问题
初始时很迷茫，所学有限，大体知道是计算机编码问题，但自己肚子里只有 escape 、encodeURI 两个编码函数及对应解析函数，没有深入理解探究，所以这里出了问题不能及时解决。
查阅资料后发现，实际前端解析常用函数有这些：
escapeencodeURIencodeURIComponent
官方很明确提示，在对通过url传值时使用encodeURIComponent进行编码，最初是为了防止 # 等字符打断url解析，但同样适用于这里的 加号丢失，因为 vue-router 在解析 url 时，默认对参数进行转码操作，第一步就是 encodeURIComponent 编码，所以，之前我们用encodeURI编码参数，传递时，加号没有进行转码，vue-router 帮我们再次转了一下，转的过程中，将加号替换成了空格，接着在目标页面进行 decodeURI 解码才失败了，因为此时加号已经变成了空格。