javascript - 向从 api 响应获得的字符串添加其他字符

Question

我收到了

形式的 api 响应

{
    "mobile": [
        {
            "resolution": "S240p",
            "url": "Sample_url1"
        },
        {
            "resolution": "M360p",
            "url": "Sample_url2"
        },
        {
            "resolution": "HD720p",
            "url": "Sample_url3"
        }
    ]
}

但是从前端我需要将它显示为 S: 240p 而不仅仅是 S240p ，下面是 React 中的代码，有没有办法从前端实现这个。

Mobile.js

isMobile ? dpi_url && 
    dpi_url.mobile.map((value, index) => (
       <Link
            download
            onClick={this.downloadModal}
            href={value.url}
         >                         
         <div className="url_name" key={index}>
            {value.resolution}
         </div>
      </Link>                           
    ))
 : null

预期结果应该是 S: 240p 但我得到的是 S240p

Answer 1

您可以使用 str.search 和 regex 找到第一个数字的索引，然后使用 substr 方法根据您的需要拆分字符串:

const digitIndex = value.resolution.search(/\d/);
const formattedResolution = value.resolution.substr(0,digitIndex)+": "+value.resolution.substr(digitIndex);

然后显示它:

<div className="url_name" key={index}>
            {formattedResolution}
 </div>