使用JSX在Reactjs中安全导航操作符

Question

我通过JSX使用Reactjs。在此方法中是否有任何安全的导航操作符？我尝试使用问号操作符，如＆＃34; foo？.bar＆＃34;但我得到了语法错误。

Answer 1

安全导航操作员（aka。猫王操作员）是TC39的草案状态proposal，所以没有。还没有（截至本文撰写时）。

但这种丑陋的语法会让你在没有图书馆的情况下获得成功。而不是......

foo?.bar

...使用此...

(foo||{}).bar||{}

很难阅读，但它有效，而且不依赖于图书馆。

Answer 2

您可以使用lodash库中的get方法，如下所示：

import { get } from 'lodash';

get(foo, 'bar1.bar2.bar3.bar4');

Answer 3

现在，有一个名为@ babel / plugin-proposal-optional-chaining的babel插件可以解决此问题。