Uncaught TypeError: Cannot read property 'getBoundingClientRect' of undefined

[RobSteward]

I'm using the wall to display a custom card component like so:

<div v-else>
      <v-row dense>
        <vue-masonry-wall
          :items="rules"
          :options="masonryOptions"
          :ssr="{ columns: 3 }"
        >
          <template v-slot:default="{ item }">
            <LazyRuleCard :rule="item" />
          </template>
        </vue-masonry-wall>
      </v-row>
    </div>

• rules is a computed property passed from Vuex store that's bound to Firestore.
• RuleCard is a component like so

  
  <template>
  <v-card elevation="3" tile>
  <v-card-title>
      {{ rule.title }}
  </v-card-text>
   ... And so on
  <v-card-actions>
    Some card actions
  </v-card-actions>
  </v-card>
  </template>

* masonryOptions is returned from data like so 
```javascript
 masonryOptions: {
        width: 300,
        padding: {
          default: 12,
          1: 6,
          2: 8,
        },
      },

While the rules are displayed, I get this error in console. What am I doing wrong? Seems like this gets called for each of the 7 test rules that I have.

[RobSteward]

@fuxingloh Just to check - is this something your still actively developing or should I look for other packages?

[fuxingloh]

@fuxingloh Just to check - is this something your still actively developing or should I look for other packages?

I am so sorry @RobSteward, you should look for other packages if this does not fit your use case. I am little busy with my day job now.

[RobSteward]

Hi, No worries at all - I will look around. I wast just wondering if it makes sense to wait :) Good attempt though, I did like the approach.