时间戳

首页 > 解决方案 > 如何从Javascript中的字符串解析标记

javascript - 如何从Javascript中的字符串解析标记

问题描述

我一直在使用一个包react-mentions来实现一种在社交媒体应用程序中常见的类似提及的功能。

结果文本字段显示为：

 @[admin](user_id:3) hey there! @[test](vendor_id:1) @[project test](project_id:1) asdadstext example

我不熟悉标记的工作原理，如何处理这句话，以便获得结果数据：

data = {
user: [{user_id:3}]
vendor: [{vendor_id:1 }]
project: [{project_id:1}]
}

我还想问一个额外的问题，以更好地了解标记的工作原理。我是否能够将整个字符串与标记一起保存，当它显示时浏览器将自动处理标记并转换（例如）

 @[admin](user:3)

到 admin？

下面是一个运行代码的例子：

密码笔

标签： javascriptreactjs

解决方案

使用matchAll()

/@\[(.*?)]\((.*?):(\d+)\)/g

正则表达式演示

const markup = ' @[admin](user:3) hey there! @[test](vendor:1) @[project test](project:1) asdadstext example'

const parser = (markup) => {
  return [...markup.matchAll(/@\[(.*?)]\((.*?):(\d+)\)/g)]
  .reduce((a, v) => {
    a[v[2]] = (a[v[2]] || []).concat({id: +v[3], username: v[1]})
    return a
  }, {})
}

console.log(parser(markup))

推荐阅读