Question

我有一个搜索组件，可以根据搜索完成带来资产。问题是渲染被正确的资产集合调用，而且它显示在dom元素中，我不明白为什么不这样做。''它会显示在实际的浏览器窗口中。

{this.state.data.map(function (asset) {
                // Asset Card
                {
                    return (<AssetCard asset={asset} defaultValues={this.props.defaultValues}
                                       allAssetDetails={this.state.data}
                                       triggerGetAssetDocId={this.getAssetDocId} key={asset.code}/>);
                }
            }, this)}

这是父组件的一种，它调用子组件，该子组件实际上基于搜索显示资产卡。子组件看起来像

 <div className="card animated small fadeInDown">
            {/* Card Overlay - Selection */}
            <div className="select" onClick={this.selectAsset}>
                <label>
                    <input
                        type="checkbox"
                        className="filled-in"
                        name={asset.thumbnails != null &&
                        asset.thumbnails[k]
                        }
                    />
                </label>
            </div>
            <div className="card-overlay modal-trigger" data-target="asset-detail" id={asset.docId}
                 dbId={asset.dbId} code={asset.code} key={asset.code}
                 onClick={(e) => this.props.triggerGetAssetDocId(e)}>
            </div>
            {/* Card Image */}
            <div className="card-image">

            </div>
            <div className="card-details">
                {/* Card Content */}
                <div className="card-content">
                    <span className="asset-name truncate">{asset.title}</span>
                    <div className="right">

                    </div>
                </div>
                {/* Card Action */}
                <div className="card-action">
                    <span className="views">
                        <span class="jdicon-eye-open jdicon"></span>
                        {asset.vcount}
                    </span>
                    <span className="downloads">
                        <span class="jdicon-download jdicon"></span>
                        {asset.dcount}
                    </span>
                    <div className="right">
                        {/* <a className="add-wishlist"/> */}
                        <span className="badge img-format" data-format={assetFormat}>
                        {assetFormat}
                        </span>
                    </div>
                </div>
            </div>
        </div>

有人可以指出我的方法可能出问题的地方吗？

Answer 1

您从父母发送给孩子的“资产”数据将通过属性传输，因此可以通过“ this.props”进行评估，假设您要获取标题，可以执行this.props.asset.title。同样，您也可以访问其他数据。希望对您有帮助

React dom元素已加载，但实际上未显示在浏览器中

1 个答案: