一个bug的思考---前端URI编解码

bug描述：angular项目中路由跳转的时候，路由传参出现问题

假设，路由定义如下：

{

path: 'update/:name',

component: PropertyComponent

}

跳转：

this.router.navigateByUrl("update/name")

name是需要传的参数，问题就出在name的取值上，如果name="xiaoming"没有问题，但如果name="xiaoming/xiaohua"就会出问题！问题就出在name中包含"/"斜杠，这个字符刚好和路由分隔"/"产生冲突，angular解析时就是"update/xiaoming/xiaohua",这样就是三级路由，找不到三级，自然报错！

解决方法：

前端开发中URI中出现保留字或特殊字符的时候必须进行编码传递，相当于服务端转义。这个前端开发的常识。

故解决此问题要先进行编码处理

编码：encodeURIComponent('xiaoming/xiaohua')输出"xiaoming%2Fxiaohua"

解码：decodeURIComponent()