mirror of
https://github.com/anatolykopyl/vue-three-d-mockup.git
synced 2026-03-26 12:55:08 +00:00
Async component
This commit is contained in:
16
README.md
16
README.md
@@ -17,9 +17,23 @@ $ npm install github:anatolykopyl/vue-three-d-mockup
|
|||||||
/>
|
/>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### Use as an async component (the 3d model is quite large so this provides a significant performance boost):
|
||||||
```js
|
```js
|
||||||
<script>
|
<script>
|
||||||
import Mockup from 'vue-tree-d-mockup'
|
import { defineAsyncComponent } from 'vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Mockup: defineAsyncComponent(() => import('vue-three-d-mockup')),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Or normally:
|
||||||
|
```js
|
||||||
|
<script>
|
||||||
|
import Mockup from 'vue-three-d-mockup';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
|||||||
@@ -1,16 +1,18 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div>
|
||||||
<Mockup
|
<Mockup
|
||||||
class="mockup"
|
class="mockup"
|
||||||
screenImg="screen.png"
|
screenImg="screen.png"
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Mockup from './Mockup.vue';
|
import { defineAsyncComponent } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
Mockup,
|
Mockup: defineAsyncComponent(() => import('./Mockup.vue')),
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user