@@ -202,7 +202,7 @@ export default {
202202 // Is the menu open or not
203203 open: false ,
204204 },
205- breadcrumbsRefs: {} ,
205+ breadcrumbsRefs: [] ,
206206 }
207207 },
208208 created () {
@@ -262,13 +262,11 @@ export default {
262262 if (! this .$refs .container ) {
263263 return
264264 }
265- // All breadcrumb components passed into the default slot
266- const breadcrumbs = Object .values (this .breadcrumbsRefs )
267265
268- const nrCrumbs = breadcrumbs .length
266+ const nrCrumbs = this . breadcrumbsRefs .length
269267 const hiddenIndices = []
270268 const availableWidth = this .$refs .container .offsetWidth
271- let totalWidth = this .getTotalWidth (breadcrumbs )
269+ let totalWidth = this .getTotalWidth ()
272270 // If we have breadcrumbs actions, we have to take their width into account too.
273271 if (this .$refs .breadcrumb__actions ) {
274272 totalWidth += this .$refs .breadcrumb__actions .offsetWidth
@@ -284,7 +282,7 @@ export default {
284282 // We hide elements alternating to the left and right
285283 const currentIndex = startIndex + ((i % 2 ) ? i + 1 : i) / 2 * Math .pow (- 1 , i + (nrCrumbs % 2 ))
286284 // Calculate the remaining overflow width after hiding this breadcrumb
287- overflow -= this .getWidth (breadcrumbs [currentIndex]? .$el )
285+ overflow -= this .getWidth (this . breadcrumbsRefs [currentIndex]? .$el )
288286 hiddenIndices .push (currentIndex)
289287 i++
290288 }
@@ -317,11 +315,10 @@ export default {
317315 /**
318316 * Calculates the total width of all breadcrumbs
319317 *
320- * @param {Array} breadcrumbs All breadcrumbs
321318 * @return {number} The total width
322319 */
323- getTotalWidth (breadcrumbs ) {
324- return breadcrumbs .reduce ((width , crumb ) => width + this .getWidth (crumb .$el ), 0 )
320+ getTotalWidth () {
321+ return this . breadcrumbsRefs .reduce ((width , crumb ) => width + this .getWidth (crumb .$el ), 0 )
325322 },
326323 /**
327324 * Calculates the width of the provided element
@@ -457,8 +454,7 @@ export default {
457454 * add it to the array of all crumbs.
458455 */
459456 hideCrumbs () {
460- const crumbs = Object .values (this .breadcrumbsRefs )
461- crumbs .forEach ((crumb , i ) => {
457+ this .breadcrumbsRefs .forEach ((crumb , i ) => {
462458 if (crumb? .$el ? .classList ) {
463459 if (this .hiddenIndices .includes (i)) {
464460 crumb .$el .classList .add (` ${ crumbClass} --hidden` )
@@ -513,7 +509,7 @@ export default {
513509 * and don't write to this.breadcrumbsRefs directly
514510 * to not trigger a myriad of re-renders.
515511 */
516- const breadcrumbsRefs = {}
512+ const breadcrumbsRefs = []
517513 // Add the breadcrumbs to the array of the created VNodes, check if hiding them is necessary.
518514 breadcrumbs = breadcrumbs .map ((crumb , index ) => cloneVNode (crumb, {
519515 ref : (crumb ) => {
0 commit comments