Skip to content

Component layout in depth

Jump to bottom
timtnlee edited this page Jun 19, 2019 · 7 revisions

Component layout in depth (clipper-basic)

clipper-basic has six props about layout setting that you should be careful using them: ratio, wrapRatio, minWidth, minHeight, initWidth and initHeight.

  • ratio: ratio(width/height) of the clip box.
  • wrapRatio: ratio(width/height) of the clipper(container).
  • minWidth: minimum width of clip box related to clipper's width(%).
  • minHeight: minimum height of clip box related to clipper's height(%).
  • initWidth: initial width of clip box related to clipper's width(%) when the image loaded.
  • initHeight: initial height of clip box related to clipper's height (%) when the image loaded.

Invalid settings

Don't let minWidth greater than initWidth or minHeight greater than initHeight, these are invalid settings and will throw errors!

// ...

Clone this wiki locally