要素がマップ（中に存在するかどうかを確認する方法）リアクト

Vova：

私は、コードを働いています

const products = this.state.products.map((product, i) => 
        product.fields.company.fields.slug === this.props.match.params.slug ?
        <Suspense key={i} fallback={<div>Loading...</div>}>
            <ProductListItem id={i} key={i} product={product} />
        </Suspense>
        : null)

        return(
            <div className="partner-details" style={partnerD}>
                <div className="container-xl">
                    <Button type="button" className="btn btn-secondary" onClick={this.props.history.goBack}>
                        <i className="fa fa-arrow-left"></i>&nbsp; Get back
                    </Button>
                    <ul>
                        <div className="product-item">
                            {products}
                        </div>
                    </ul>
                </div>
            </div>             
        )

しかし、もし問題があるproduct.fields.company.fields.slug（company.fields.slugが）私のコードがクラッシュ存在しません。どのように私はそれがいるかどうかを確認するために余分な三項演算子を追加することができますproduct.fields.company前にこれを実行する存在しますproduct.fields.company.fields.slug === this.props.match.params.slug

ありがとう！

カリム：

ご使用の環境がサポートがある場合は、オプションのチェーンを、あなたはこれを行うことができます

product?.fields?.company?.fields?.slug === this.props.match.params.slug ?  .. : ..

そうでなければ、各フィールドがtruthyであることを確認する必要があります

product && product.fields && product.fields.company && product.fields.company.fields && product.fields.company.fields.slug === this.props.match.params.slug ? .. : ..