如何使用正则表达式在 JSX 标签中获取 prop 的值（可能是 multi-line）？

Question

我想从这些 JSX 元素中获取标题属性的值，

      <Story title={'Disabled Text Input'}>
        <TextInput label="Disabled Text Input" disabled />
      </Story>
      <Story 
         title={'Disabled ways for
                 Text Input to work'}>
        <TextInput label="Disabled Text Input" 
          disabled 
          {...someExtraProps}/>
      </Story>

对于上面的例子，

禁用文本输入

文本输入的禁用方式

我正在尝试使用正则表达式，使用分组，

I was able to get the children of Story JSX element, using /<Story[^]+?>(?<component>[^$]*?)<\/Story>/g

但正在努力获取标题道具的价值。因为它可以是以下任何一种形式，

title={"some"}
title="Some"
title='Some'
title={'Some'}

Answer 1

所以我确实使用正则表达式作为解决方案的第一步。但后来我遇到了这个工具箱， React-Docgen 其确切目的是为文档生成提取信息。

如何使用正则表达式在 JSX 标签中获取 prop 的值（可能是 multi-line）？

How to get the value of prop (which could be multi-line) in JSX tag using regex?

javascript

regex

jsx

regex-group

reactjs