小编Sim*_*tko的帖子

我偶然发现了一个我似乎无法解决的问题.我试图在这里搜索解决方案,但无法自助.我是javascript的新手,反应如此体贴.

问题:我正在使用react(16.5.0)和nextjs(6.1.2)和styled-jsx一样:

import React, {Component} from 'react';
import PropTypes from 'prop-types';
import Link from 'next/link';

class ProductCard extends Component {
    constructor(props) {
        super(props);
        this.state = {imgLoaded: false};
        this.imgHasLoaded = this.imgHasLoaded.bind(this);
    }

    imgHasLoaded() {
        this.setState({imgLoaded:true})
    }

    render() {
        return (
            <div className="thumbnail-container">
                <div className="loader-box">
                    <img src={require("../static/loading.png")} className="loading-img" />
                </div>
                <img src={this.props.imgSrc} className="main-img" onLoad={this.imgHasLoaded} />
                <div className="thumbnail-text">
                    {this.props.text}
                </div>
                <ul className="item-list">
                    {this.props.links.map(link =>
                        <li className="item">
                            <span className="item-span"> {link.text} </span>
                            {link.subLinks &&
                                <ul className="sub-item-list">
                                    {link.subLinks.map(subLink => <li>{subLink.text}</li>)}
                                </ul>
                            }
                        </li>
                    )}
                </ul>
                <style …