doc: lazyload demo iframe

bobocui · Apr 30, 2018 · 658f5f6 · 658f5f6
1 parent 970a9de
commit 658f5f6
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 1 deletion.
diff --git a/docs/compile.js b/docs/compile.js
@@ -634,7 +634,9 @@ export default {
         </div>
         <div class="demos" :style="{height: demo.height}">
           <div class="demo-iframe-box">
-            <iframe :src="domain + '?locale=${lang}&transition=none&hide-nav=true&hide-tab-bar=true#/components/' + demo.file" width="375" height="600" border="0" frameborder="0" style="margin: 0 auto;"></iframe>
+            <lazy-component>
+              <iframe :src="domain + '?locale=${lang}&transition=none&hide-nav=true&hide-tab-bar=true#/components/' + demo.file" width="375" height="600" border="0" frameborder="0" style="margin: 0 auto;"></iframe>
+            </lazy-component>
           </div>
           <div class="demo-code-box" :style="{overflow: demo.height === demoHeight ? 'hidden' : 'scroll'}">
             <div v-html="demo.code" contenteditable></div>

diff --git a/docs/package.json b/docs/package.json
@@ -21,6 +21,7 @@
     "v-markdown-loader": "0.6.3",
     "vue": "2.5.16",
     "vue-clipboard2": "^0.1.0",
+    "vue-lazyload": "^1.2.3",
     "vue-meta": "^1.0.4",
     "vue-template-compiler": "2.5.16",
     "yaml-loader": "^0.4.0"

diff --git a/docs/src/index.js b/docs/src/index.js
@@ -6,10 +6,15 @@ import axios from 'axios'
 import yaml from 'js-yaml'
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
+import VueLazyload from 'vue-lazyload'
 
 import VueClipboard from 'vue-clipboard2'
 Vue.use(VueClipboard)
 
+Vue.use(VueLazyload,  {
+  lazyComponent: true
+})
+
 Vue.use(ElementUI)
 Vue.use(Vuex)
 

diff --git a/docs/yarn.lock b/docs/yarn.lock
@@ -4834,6 +4834,10 @@ vue-hot-reload-api@^2.1.0:
   version "2.1.0"
   resolved "http://registry.npm.taobao.org/vue-hot-reload-api/download/vue-hot-reload-api-2.1.0.tgz#9ca58a6e0df9078554ce1708688b6578754d86de"
 
+vue-lazyload@^1.2.3:
+  version "1.2.3"
+  resolved "http://registry.npm.taobao.org/vue-lazyload/download/vue-lazyload-1.2.3.tgz#901f9ec15c7e6ca78781a2bae4a343686bdedb2c"
+
 vue-loader@^12.0.3:
   version "12.2.1"
   resolved "http://registry.npm.taobao.org/vue-loader/download/vue-loader-12.2.1.tgz#53f27c0973d386768f5a75156f4129b5efc6ba55"