问单击链接组件后componentWillReceiveProps未接收到道具

EN

import React, { Component } from 'react';

class ProductDetail extends Component {
  constructor() {

    super();

    this.state = {
      product: {}
    };

    this.getCurrentProduct = this.getCurrentProduct.bind(this);
  }

  componentWillReceiveProps(nextProps) {

    this.getCurrentProduct(nextProps.products);
  }

  getCurrentProduct(products) {

    const slug = this.context.match.parent.params.id;

    const product = products.filter(product => {
      return product.handle === slug;
    })[0];

    this.setState({ product });
  }

  render() {
    return (
      <main className="view view--home">
        {this.state.product.title}
      </main>
    );
  }
}

ProductDetail.contextTypes = {
  match: React.PropTypes.object
}

export default ProductDetail;

import React, { Component } from 'react';
import { Link } from 'react-router';

class ProductCard extends Component {
  render() {
    const { details } = this.props;
    return (
      <figure className="product-card">
        <Link to={`/product/${this.props.id}`}>
          <img src={details.images[0].src} alt={details.title} className="product-card__thumbnail" />
        </Link>
        <Link to={`/product/${this.props.id}`}>
          <figcaption className="product-card__body">
            <h3 className="product-card__title">{details.title}</h3>
            <span className="product-card__price">{details.rendered_price}</span>
          </figcaption>
        </Link>
      </figure>
    )
  }
}