获取成员组件(SVG)父元素的宽度和高度

Question

我正在尝试使用组件创建一个SVG包装器。我的应用程序将允许用户从列表中呈现不同的SVG。

我希望这些SVG适合屏幕；所以我想，在组件插入屏幕之前，我会得到DOM父元素的宽度和高度。

这是我尝试过的代码。该问题似乎与SVG有关，因为当tagName被设置为span甚至没有被设置时；一切如预期。

import Ember from 'ember';
export default Ember.Component.extend({
  tagName: 'svg',
  attributeBindings: ['height', 'width', 'viewBox', 'xmlns', 'version'],
  width: getParentWidth(),
  getParentWidth: function() {
    return this.$().parent().width();
  }
});

感谢您的帮助

Answer 1

您需要等待元素插入DOM。

  getParentWidth: function() {
    return this.$().parent().width();
  }.observes('didInsertElement')