d36511479e
* Switch all components to default exports This ensures we can read all components for documentation generation (plus, standardizing is good) * Add documentation to component file * Fix table exports * Move readme docs into inline docs Includes updating new props, adding prop shapes * Add doc-generation scripts to pull exported component docs into folder * Remove key propType, causing react special-keys warning * Fix proptype * Update incorrect comment * Remove template import, we can just use string concat * Fix typo, update docs |
||
|---|---|---|
| .. | ||
| test | ||
| README.md | ||
| index.js | ||
| style.scss | ||
README.md
ProductImage
Use ProductImage to display a product's featured image. If no image can be found, a placeholder matching the front-end image placeholder will be displayed.
How to use:
import ProductImage from 'components/product-image';
render: function() {
return (
<div>
<ProductImage product={ null } />
<ProductImage product={ { images: [] } } />
<ProductImage product={ { images: [
{
src: 'https://i.cloudup.com/pt4DjwRB84-3000x3000.png',
},
] } } />
</div>
);
}
Props
product: Product object. The image to display will be pulled fromproduct.images. See https://woocommerce.github.io/woocommerce-rest-api-docs/#product-propertieswidth: Default 60. The width of image to display.height: Default 60. The height of image to display.alt: Text to use as the image alt attribute.className: Additional CSS classes.