|
123456789101112131415161718192021222324252627282930313233343536373839404142 |
- import '../../../src/stylus/components/_responsive.styl';
- // Mixins
- import Measurable from '../../mixins/measurable';
- // Utils
- import mixins from '../../util/mixins';
- /* @vue/component */
- export default mixins(Measurable).extend({
- name: 'v-responsive',
- props: {
- aspectRatio: [String, Number]
- },
- computed: {
- computedAspectRatio: function computedAspectRatio() {
- return Number(this.aspectRatio);
- },
- aspectStyle: function aspectStyle() {
- return this.computedAspectRatio ? { paddingBottom: 1 / this.computedAspectRatio * 100 + '%' } : undefined;
- },
- __cachedSizer: function __cachedSizer() {
- if (!this.aspectStyle) return [];
- return this.$createElement('div', {
- style: this.aspectStyle,
- staticClass: 'v-responsive__sizer'
- });
- }
- },
- methods: {
- genContent: function genContent() {
- return this.$createElement('div', {
- staticClass: 'v-responsive__content'
- }, this.$slots.default);
- }
- },
- render: function render(h) {
- return h('div', {
- staticClass: 'v-responsive',
- style: this.measurableStyles,
- on: this.$listeners
- }, [this.__cachedSizer, this.genContent()]);
- }
- });
- //# sourceMappingURL=VResponsive.js.map
|