带字符串和大括号的REACT/JSX属性

本文介绍了带字符串和大括号的REACT/JSX属性的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

docs表示带字符串的JSX属性与带大括号的属性相同.

<Thing attr='val' /> === <Thing attr={'val'} />

我想我读过一些东西，上面说只有在需要的时候才使用大括号，因为字符串的性能更好，但我现在找不到参考资料了。大括号是否有评估费用？

推荐答案

花括号是否有评估费用

是的，正如您可以看到的，{}中的任何内容都将被视为javascript代码，因此将被执行，如果您只想分配字符串，那么 只需使用attr='val'而不是attr={'val'}

但如果基于分配条件，则可以使用attr={'val'}

喜欢

attr={ (condition) ? 'val1' : 'val2'}

我希望这能让您理清思路。

---

有关更多详细信息：

https://reactjs/docs/jsx-in-depth.html

您可以在这里阅读字符串插值和速度性能的幕后内容：

https://koukia.ca/string-interpolation-vs-string-format-string-concat-and-string-builder-performance-benchmarks-c1dad38032a

这篇关于带字符串和大括号的REACT/JSX属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！