非Chrome浏览器上的Iron-resize事件问题

Question

我正在使用Polymer framework 1.x版开发单页应用程序。我创建了一个响应元素，它根据宽度计算列数。我使用Polymer.IronResizableBehavior，它会在调整窗口大小时触发iron-resize事件。

以下是代码的重要摘要：

        listeners: {
            'iron-resize': '_onWidthChange'
        },

        _onWidthChange: function () {
            var numberOfColumns,
                w = this.$.animated_calendar.offsetWidth;

            if (w > 0) {
                numberOfColumns = w / 100 >> 0;
                if (numberOfColumns > 7) numberOfColumns = 7;
                else if (numberOfColumns === 0) numberOfColumns = 1;
                this.numberOfColumns = numberOfColumns;
            }
        },

问题是，当首次在Firefox和IE上呈现元素时，我得到0宽度。当我调整窗口大小时，再次调用该函数并接收到正确的offsetWidth。

我可以创建一个变通方法，如果宽度为0，则会获得浏览器类型，并确定它是否为桌面，并相应地设置numberOfColumns。然而，它会非常混乱，而且这种行为并不理想。

我希望当Polymer 2.0问世（它应该在第一季度发布）时我会得到正确的行为，但我现在需要让它工作，所以谢谢你的建议。