QResponsive 是一个强制内容根据其宽度保持宽高比的组件。
¥QResponsive is a component which forces the content to maintain an aspect ratio based on its width.
用法(Usage)
¥Usage
TIPS
只要你只指定一个直接子组件，该组件就可以与任何内容一起使用。如果你需要其中包含多个元素，请将它们封装在
<div>中。¥The component can be used with any content, as long you specify only one direct child. If you need multiple elements inside of it, wrap them in a
<div>.你有责任确保你的内容不会溢出容器。
¥It is your responsibility to make sure that your content won’t overflow the container.
警告
不要在已经具有 ratio 属性的 Quasar 组件（例如 QImg 或 QVideo）或具有强制高度的组件上使用它。
¥Do not use it on Quasar components that already have a ratio property, like QImg or QVideo, or on components that have a forced height.
基本(Basic)
¥Basic
Flex 行(Flex row)
¥Flex row
请注意，我们使用了垂直对齐方式 (items-start)，而不是默认的 (stretch)，这样 flexbox 就不会强制每个 QResponsive 组件的高度。
¥Note below that we are using a vertical alignment (items-start) other than the default (stretch), so that flexbox won’t force the height on each QResponsive component.
在某些组件上(On some components)
¥On some components
以下只是几个例子。QResponsive 不仅限于 QCard 和 QCarousel。
¥Below are just a few examples. QResponsive is not restricted to only QCard and QCarousel.
请注意，当我们在 QCarousel 上使用 QResponsive 时，我们不会向其提供 height 属性，因为 QResponsive 会处理这个问题。
¥Notice that we will not supply a height prop to QCarousel when we use QResponsive on it, since it’s QResponsive who will take care of that.
最大高度(Maximum height)
¥Maximum height
通过 CSS 类或内联代码直接在 QResponsive 组件上应用最大高度（或最大宽度等）。请记住，你仍然有责任确保内容不会溢出容器。
¥Apply the max height (or max width, etc etc) directly on the QResponsive component through a CSS class or inline. Remember that it is still your responsibility to ensure that the content won’t overflow the container.