1. 问题描述
在el-table中的记录列表中放置了一个 操作按钮,点这个按钮时可以新增一个tab页签,并将通过路由传参方式将一些信息传递到新打开的tab页签中,但发现传递中文参数时会出现 failed to execute 'setrequestheader' on 'xmlhttprequest': string contains non iso-8859-1 code point.的错误,如下
1.1. 当前vue组件
{{ scope.row.modulename }}
1.2. 跳转到的vue组件
1.3. 出现的错误
信息提示
浏览器控制台打印
xhr.js:126 uncaught (in promise) typeerror: failed to execute 'setrequestheader' on 'xmlhttprequest': string contains non iso-8859-1 code point. at setrequestheader (xhr.js:126:1) at object.foreach (utils.js:238:1) at dispatchxhrrequest (xhr.js:120:1) at new promise () at xhradapter (xhr.js:12:1) at dispatchrequest (dispatchrequest.js:52:1)
2. 解决方法
原因是在前端跳转页面时,url参数中的内容出现了中文。要解决此问题必须对传递中文字符的参数值进行编码,在接收到参数后再对其进行解码即可解决。
js中通过下面两个方法进行编码与解码操作
- 编码:encodeuricomponent(str)
- 解码:decodeuricomponent(str)
2.1. 当前vue组件
{{ scope.row.modulename }}
2.2. 跳转到的vue组件
以上就是vue2路由跳转传参中文问题处理方案的详细内容,更多关于vue2路由跳转传参的资料请关注其它相关文章!