diff options
author | Phil Hughes <me@iamphill.com> | 2017-11-06 11:53:33 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2017-11-06 13:52:04 +0300 |
commit | eacd821a3c0bae80a56a6933d5ab6aea4b9f283e (patch) | |
tree | a8a1ddf44d0b2b840ceb9a855ee0fc3a6c1c5187 /app/assets/javascripts/vue_shared | |
parent | e2bcb3a46fd7d29bcbd17101e9a4e8f7d0ca4746 (diff) |
moved key into data structure
uses an array of classes to render skeleton loading cells
Diffstat (limited to 'app/assets/javascripts/vue_shared')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue | 11 |
1 files changed, 8 insertions, 3 deletions
diff --git a/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue b/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue index 4e759fb6c6c..7ab5e069003 100644 --- a/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue +++ b/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue @@ -12,6 +12,11 @@ default: 6, }, }, + computed: { + lineClasses() { + return new Array(this.lines).fill().map((_, i) => `skeleton-line-${i}`); + }, + }, }; </script> @@ -23,9 +28,9 @@ }" > <div - v-for="line in lines" - :key="line" - :class="'skeleton-line-' + line" + v-for="(css, index) in lineClasses" + :key="index" + :class="css" > </div> </div> |