字符串未在URL中正确显示以处理%20的空格

Question

我所做的就是根据一些变量创建一个动态URL，然后在单击按钮时将该链接发送给电子邮件中的某个人。但是，电子邮件中的链接不会与%20一起出现，即使当我控制台记录它时它也会出现。

employee变量以Adam Norton的形式进入函数。stringEmployee按应有的方式以Adam%20Norton的形式记录。link变量，它也以webaddress/Adam%Norton的形式登录。

但是在实际的电子邮件中，链接变量以http://localhost:3000/hca-survey/Adam Norton的形式出现，这当然会破坏链接。

如果我手动在链接变量中输入Adam%20Norton，那么一切都会正常工作。

但是，如果我在链接中使用${stringEmployee}变量，如下面的代码所示，它会将实际的空白放回电子邮件正文中。

我遗漏了什么？

sendSurvey(employee, client) {
    let stringEmployee = employee.replace(/ /g, "%20");
    console.log(stringEmployee);   <--- this logs "http://localhost:3000/hca-surveyAdam%20Norton" as expected

    const link = `http://localhost:3000/hca-survey/${stringEmployee}`;
    console.log(link);   <-- this logs "http://localhost:3000/hca-survey/Adam%20Norton as expected

    const subject = `Human Capital Analysis - ${employee}`;
    
    const body = `Hello, ${employee}. ${client} has selected you to participate in our Human Capital Analysis survey. Please click the link below in order to complete the survey at your convenience.`;
    
    window.open(`mailto:?subject=${subject}&body=${body}
    
    %0D%0A%0D%0A${link} <-- this appears in the email as "http://localhost:3000/hca-survey/Adam Norton", why?
    
    %0D%0A%0D%0AThank%20You%20for%20your%20responses...`);
  }

Answer 1

window.open接受一个url，在您的例子中，它是默认邮件程序的应用程序url，然后您使用一个已经对查询参数友好的链接作为查询参数提供内容，但是您想要的是，它需要2次查询字符串解码友好，所以您只需要使用encodeURI再次对其进行编码。

stringEmployee = encodeURI(stringEmployee);