Fatal编程技术网
  • javascript/
  • Javascript Vue.js：带换行符的字符串插值

Javascript Vue.js：带换行符的字符串插值

javascript vue.js

Javascript Vue.js：带换行符的字符串插值,javascript,vue.js,line-breaks,string-interpolation,Javascript,Vue.js,Line Breaks,String Interpolation,在我的HTML this.externalUsers = data.externalUser.map(element => `Name: ${element.firstName} ${element.lastName}\n <br><br />Email: ${element.email}`); this.externalUsers=data.externalUser.map（element=>`Name:${element.firstName}${element

在我的
HTML

this.externalUsers = data.externalUser.map(element => `Name: ${element.firstName} ${element.lastName}\n <br><br />Email: ${element.email}`);

this.externalUsers=data.externalUser.map（element=>`Name:${element.firstName}${element.lastName}\n

电子邮件：${element.Email}`）；
在上面的一行中，我试图在一行中获得名字和姓氏，在下一行中获得电子邮件

<v-radio 
  v-for="item in externalUsers" 
  :key="item.id"
  :label="item"
  :value="item"
></v-radio>
我正在使用Vue，所以我正在使用for a循环打印它

结果如下

您可以使用
空白：行前如下所示：



newvue({
el:“应用程序”，
vuetify:新的vuetify（），
数据：（）=>({
外部用户：[
{firstName:'firstName1'，lastName:'lastName1'，email:'email1'}，
{firstName:'firstName2'，lastName:'lastName2'，email:'email2'}，
{firstName:'firstName3'，lastName:'lastName3'，email:'email3'}，
]
}),
计算：{
外部用户（）{
返回此.externalUser.map（元素=>
`名称：${element.firstName}${element.lastName}\nEmail:${element.email}`）；
}
}
});

#应用程序{空白：行前；}




您不需要

；

标记始终是无内容标记，因此只要

就足够了。换行符、回车符和制表符等空白字符将标准化为空格，或在添加到DOM时删除。字符串中的
\n
不起任何作用。Vue可能会在呈现HTML之前对其进行清理；我确信有一个问题是关于如何绕过它的，所以。。。