为什么要对url进行编码？

当使用地址栏提交查询参数时，如果不编码，非英文字符会按照操作系统的字符集进行编码提交到服务器，服务器会按照配置的字符集进行解码，所以如果两者不一致就会导致乱码。

JavaScript encodeURIComponent() 函数

encodeURIComponent() encodeURIComponent()函数可把字符串作为 URI 组件进行编码。

该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。

其他字符（比如：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。

encodeURIComponent(uri)

参数	描述
url	必需。一个字符串，含有 URI 组件或其他要编码的文本

this.$router.push({ path: "页面url", query:{ userName:encodeURIComponent(this.name)//中文汉字 } });

decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。

提示： 使用 encodeURIComponent() 方法可以对 URI 进行编码。

decodeURIComponent(uri)

参数	描述
url	必需。一个字符串，含有编码 URI 组件或其他要解码的文本。

let name = decodeURIComponent(params.userName);

this.userName = decodeURIComponent(name);

以上代码解码了两次，如解码一次还是乱码，那就再解码一次，我就是这么做的

encodeURI使用的是 UTF-8 编码规则来编的，当服务器接收url的参数后会自动解码一次，但自动解码的字符集不一定是UTF-8，字符集不一致时解码会出现乱码。