Ember Отзывчивый компонент iFrame

Question

Я внедряю PPT в свое приложение, поэтому мне нужен отзывчивый iFrame. Не могу заставить это работать с приближенным CSS, я посмотрел на here.

Я думаю, что лучший способ - просто создать простой компонент с высотой и шириной. Могу ли я сделать эти рассчитанные свойства/наблюдатели, которые прослушивают и обновляют размер браузера?

Или мне нужно создать событие изменения размера и обновить свойства события?

Небольшой пример кода был бы очень признателен!

Благодаря

Answer 1

Я бы рекомендовал использовать подход, основанный CSS, но вы можете использовать компонент и использовать событие изменения размера. По существу, вы бы добавили слушателей события в window в свой крюк didInsertElement и убрали их в свой крючок willDestroyElement. Просто используйте jQuery's .on() и .off().

onResize() { 
    // do whatever you want to calculate your values 
    set(this, 'my-frame-with', ...); 
}, 
init() { 
    set(this, 'boundOnResize', get(this, 'onResize').bind(this)); 
}, 
didInsertElement() { 
    jQuery(window).on('resize', get(this, 'boundOnResize')); 
}, 
willDestroyElement() { 
    jQuery(window).off('resize', get(this, 'boundOnResize')); 
} 

Вы не можете использовать для этого рассчитанные свойства, поскольку они должны зависеть от наблюдаемых свойств. Это не будет работать для простых свойств JS, потому что это в функциональности ember. Так что вам нужно отчасти обернуть им вот так.