javascript - 使用 lodash 的 typescript 字符串插值

Question

在我的应用程序中，我有一个 H 自定义组件，它接受一个标题和一个子标题作为 Prop 。

对于我的 header 属性，我想将 lodash 表达式与一个字符串连接起来。请参阅下面我的代码。

        <H
          header= `${_.startCase(type)} SomeString`
          subheader= "Lorem ipsum do eiusmod"
        />

我已经尝试了这里的建议 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals ，但可能是因为我使用的是 lodash，它无法正常工作。

Answer 1

您的 Prop 语法不正确:

header={`${_.startCase(type)} SomeString`}

在 React 中，任何包含 code 的 prop 值都必须包含在 {} 中.

只有像 prop="a string" 这样的常量字符串可以在没有一对封闭 {} 的情况下通过.所有其他值都需要它*。

---

* 嗯，有两种特殊情况。

children设置如下。这里children类似于 <>content</> .

<MyComponent>content</MyComponent>

和 bool 速记 Prop 。这里isCool是true .

<MyComponent isCool />

尽管如此，如果您想将其设置为 false你又需要花括号了:

<MyComponent isCool={false} />