[10/13] incubator-weex-site git commit: [WEEX-455] Add examples page to the website (#166)

Thu, 14 Jun 2018 20:42:46 -0700 

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/package.json
----------------------------------------------------------------------
diff --git a/package.json b/package.json
index f567920..cf0ab1d 100644
--- a/package.json
+++ b/package.json
@@ -3,13 +3,15 @@
   "version": "0.0.0",
   "private": true,
   "hexo": {
-    "version": "3.4.4"
+    "version": "3.7.1"
   },
   "scripts": {
     "server": "hexo server",
     "clean": "rm -rf .deploy_git && hexo clean",
     "deploy": "npm run clean && hexo deploy",
     "build": "hexo g -d -w",
+    "build:examples": "webpack --config examples/website/webpack.config.js",
+    "dev:examples": "webpack --watch --config 
examples/website/webpack.config.js",
     "test": "node test/url-validator.js"
   },
   "dependencies": {
@@ -33,11 +35,19 @@
     "uglify-js": "^3.3.7"
   },
   "devDependencies": {
+    "babel-core": "^6.26.3",
+    "babel-loader": "^7.1.4",
     "chalk": "^2.3.2",
+    "css-loader": "^0.28.11",
     "find-line-column": "^0.5.2",
     "glob": "^7.1.2",
     "node-fetch": "^2.1.1",
     "string-similarity": "^1.2.0",
-    "url-extractor": "^2.0.2"
+    "uglifyjs-webpack-plugin": "^1.2.5",
+    "url-extractor": "^2.0.2",
+    "vue-loader": "^15.2.4",
+    "vue-template-compiler": "^2.5.16",
+    "webpack": "^4.12.0",
+    "webpack-cli": "^3.0.3"
   }
 }

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/source/cn/examples.ejs
----------------------------------------------------------------------
diff --git a/source/cn/examples.ejs b/source/cn/examples.ejs
new file mode 100644
index 0000000..e64c436
--- /dev/null
+++ b/source/cn/examples.ejs
@@ -0,0 +1,3 @@
+layout: examples
+type: examples
+---

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/source/examples.ejs
----------------------------------------------------------------------
diff --git a/source/examples.ejs b/source/examples.ejs
new file mode 100644
index 0000000..e64c436
--- /dev/null
+++ b/source/examples.ejs
@@ -0,0 +1,3 @@
+layout: examples
+type: examples
+---

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/layout/_partial/header.ejs
----------------------------------------------------------------------
diff --git a/themes/weex/layout/_partial/header.ejs 
b/themes/weex/layout/_partial/header.ejs
index 52ae877..bc544de 100644
--- a/themes/weex/layout/_partial/header.ejs
+++ b/themes/weex/layout/_partial/header.ejs
@@ -53,7 +53,7 @@
               <a href="<%= url_for_lang('who-is-using-weex.html') %>"><%= 
_p('menu.usingWeex') %></a>
             </li>
             <li>
-              <a target="_blank" 
href="https://hanks10100.github.io/weex-vue-examples/";><%= _p('menu.examples') 
%></a>
+              <a href="<%= url_for_lang('examples.html') %>"><%= 
_p('menu.examples') %></a>
             </li>
           </ul>
         </li>

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/layout/example.ejs
----------------------------------------------------------------------
diff --git a/themes/weex/layout/example.ejs b/themes/weex/layout/example.ejs
deleted file mode 100644
index 3976408..0000000
--- a/themes/weex/layout/example.ejs
+++ /dev/null
@@ -1,40 +0,0 @@
-<div class="example-wrapper clearfix">
-  <div class="horizontal">
-    <h2><%- page.title %></h2>
-    <%- page.content %>      
-  </div>
-  <div class="horizontal phone">
-    <div class="mock-phone">
-      <div class="inner">
-        <iframe frameborder="0" src="about:blank" id="iframe">
-        </iframe>
-      </div>
-      <div class="camera"></div>
-      <div class="earpiece"></div>
-      <div class="home-btn"></div>
-    </div>
-  </div>
-  <div class="horizontal qrcode">
-    <div id="qrcode-img"></div>
-    <p>Playground Scan</p>
-    <p>目前还未提供 Playground 正式版下载，需要手动 build 
playground。</p>
-  </div>
-</div>
-<script>
-  var WEB_BUNDLE_URL = location.origin + ROOT + 'js/examples/' + '<%- 
page.title %>' + '.web.js'
-  var NATIVE_BUNDLE_URL = location.origin + ROOT + 'js/examples/' + '<%- 
page.title %>' + '.weex.js'
-</script>
-
-<%- js('js/qrcode.min.js') %>
-<%- js('js/example.js') %>
-
-<script>
-var qrcode = new QRCode(document.getElementById("qrcode-img"), {
-    text: NATIVE_BUNDLE_URL,
-    width: 150,
-    height: 150,
-    colorDark : "#000000",
-    colorLight : "#ffffff",
-    correctLevel : QRCode.CorrectLevel.H
-});
-</script>

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/layout/examples.ejs
----------------------------------------------------------------------
diff --git a/themes/weex/layout/examples.ejs b/themes/weex/layout/examples.ejs
new file mode 100644
index 0000000..9b56982
--- /dev/null
+++ b/themes/weex/layout/examples.ejs
@@ -0,0 +1,19 @@
+<script>
+  ;(function(){
+    var selectedLanguage = 'en'
+    if (window.localStorage) {
+      selectedLanguage = window.localStorage.getItem('lang')
+    }
+    var locationLanguage = /\/cn\/examples/i.test(window.location.href) ? 'zh' 
: 'en'
+    window.currentLanguage = locationLanguage || selectedLanguage
+      || navigator.language
+      || navigator.browserLanguage || 'en'
+  })();
+</script>
+
+<%- js('js/vue.min.js') %>
+<%- css('css/examples') %>
+<div class="main-content examples-layout">
+  <div id="root"></div>
+</div>
+<%- js('js/examples.min.js') %>

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/source/css/example.scss
----------------------------------------------------------------------
diff --git a/themes/weex/source/css/example.scss 
b/themes/weex/source/css/example.scss
deleted file mode 100644
index 164040a..0000000
--- a/themes/weex/source/css/example.scss
+++ /dev/null
@@ -1,103 +0,0 @@
-.example-wrapper {
-  width: 1120px;
-  margin: 100px auto;
-  display: flex;
-  flex-direction: row;
-
-  .horizontal {
-    flex: 1;
-    padding: 20px;
-    position: relative;
-    max-width: 620px;
-    height: 600px;
-  }
-
-  .highlight {
-    height: 580px;
-    overflow-y: auto;
-  }
-
-  .phone {
-    flex: 0 0 300px;
-  }
-
-  .mock-phone {
-    margin: 0 auto;
-    margin-top: 20px;
-    position: relative;
-    z-index: 25;
-    width: 297px;
-    height: 590px;
-    border: 2px solid #0088fb;
-    border-radius: 30px;
-  }
-
-  .camera {
-    position: absolute;
-    width: 14px;
-    height: 14px;
-    border-radius: 14px;
-    background: #afddff;
-    border: 1px solid #0088fb;
-    top: 23px;
-    left: 94px;
-  }
-
-  .earpiece {
-    position: absolute;
-    width: 70px;
-    height: 8px;
-    border-radius: 8px;
-    background: #afddff;
-    border: 1px solid #0088fb;
-    top: 26px;
-    left: 124px;
-  }
-
-  .home-btn {
-    position: absolute;
-    width: 56px;
-    height: 56px;
-    border-radius: 56px;
-    background: #afddff;
-    border: 1px solid #0088fb;
-    bottom: 14px;
-    left: 50%;
-    margin-left: -28px;
-  }
-
-  .inner {
-    position: absolute;
-    top: 60px;
-    z-index: 26;
-    left: 12px;
-    width: 267px;
-    height: 441px;
-    overflow: hidden;
-    border: 1px solid #0088fb;
-  }
-
-  iframe {
-    margin: 0;
-    width: 750px;
-    height: 1248px;
-    background: #fff;
-    transform: scaleY(0.35333333);
-    transform: scale(0.35333333, 0.353333333);
-    transform-origin: top left;
-  }
-
-  .qrcode {
-    flex: 0 0 150px;
-    p {
-      text-align: center;
-      margin: 1em 0;
-    }
-  }
-
-  #qrcode-img {
-    padding: 0;
-    width: 150px;
-    height: 150px;
-  }
-}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/source/css/examples.scss
----------------------------------------------------------------------
diff --git a/themes/weex/source/css/examples.scss 
b/themes/weex/source/css/examples.scss
new file mode 100644
index 0000000..db27ddc
--- /dev/null
+++ b/themes/weex/source/css/examples.scss
@@ -0,0 +1,136 @@
+
+$brand-color: #00B4FF;
+
+/* // index page */
+.page-wrapper {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: stretch;
+  height: 100%;
+}
+.examples-layout {
+  .aside {
+    height: 100%;
+    padding: 40px 0;
+    min-height: 100%;
+    max-height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow-y: auto;
+    &.doc-nav {
+      width: 18%;
+      max-width: 320px;
+      min-width: 200px;
+    }
+  }
+}
+.github {
+  margin-bottom: 30px;
+}
+.github-logo {
+  width: 64px;
+  height: 64px;
+}
+.tab-list {
+  width: 100%;
+  list-style: none;
+  padding: 0;
+}
+.tab-item {
+  list-style: none;
+  padding: 15px;
+  color: #727272;
+  font-size: 26px;
+  cursor: pointer;
+}
+.zh .tab-item {
+  font-size: 28px;
+  text-align: center;
+  letter-spacing: 0.2em;
+}
+.en .tab-item {
+  padding-left: 40px;
+}
+.tab-item:hover {
+  background-color: #FAFAFA;
+}
+.tab-item.active-tab {
+  background-color: #EEEEEE;
+  color: $brand-color;
+}
+.main {
+  flex: 1;
+  height: 100%;
+  min-height: 100%;
+  max-height: 100%;
+  overflow-y: auto;
+}
+
+.example-panel {
+  padding: 0 20px 0 30px;
+}
+.example-section {
+  margin: 20px 0 60px;
+}
+.example-list {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+}
+.title {
+  height: 50px;
+  line-height: 50px;
+  font-size: 36px;
+  color: rgb(0, 180, 255);
+  cursor: pointer;
+}
+.desc {
+  width: 80%;
+  max-width: 800px;
+  color: #888;
+  a, a:link {
+    color: rgba($brand-color, 0.8);
+  }
+  a:hover, a:active {
+    color: $brand-color;
+  }
+}
+.example-card {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  margin: 15px 35px;
+  color: #666;
+}
+.preview {
+  display: block;
+  width: 182px;
+  height: 329px;
+  position: relative;
+  background: 
url("https://gw.alicdn.com/tfs/TB1rRl8bwnD8KJjy1XdXXaZsVXa-661-1195.png";) 0 0 
no-repeat;
+  background-size: 182px 329px;
+  transition: transform ease-in-out .2s;
+  &:hover {
+    transform: scale(1.03);
+  }
+}
+.screenshot {
+  position: absolute;
+  width: 145px;
+  height: 228px;
+  top: 42px;
+  left: 17.5px;
+}
+.message {
+  flex: 1;
+  text-align: center;
+}
+.tag {
+  border: 1px solid #DDD;
+  margin: 0 12px;
+}

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/source/css/style.scss
----------------------------------------------------------------------
diff --git a/themes/weex/source/css/style.scss 
b/themes/weex/source/css/style.scss
index f311f17..354c67b 100644
--- a/themes/weex/source/css/style.scss
+++ b/themes/weex/source/css/style.scss
@@ -21,7 +21,6 @@
 @import "playground.scss";
 
 /*EXAMPLE*/
-@import "example.scss";
 @import "atom-one-dark.scss";
 
 @import "media-queries.scss";

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/source/js/example.js
----------------------------------------------------------------------
diff --git a/themes/weex/source/js/example.js b/themes/weex/source/js/example.js
deleted file mode 100644
index 43012c4..0000000
--- a/themes/weex/source/js/example.js
+++ /dev/null
@@ -1,37 +0,0 @@
-;(function () {
-  var str = '<!DOCTYPE html>' +
-            '<html>' +
-            '<head>' +
-              '<meta charset="utf-8">' +
-              '<title>Weex Vue Demo</title>' +
-              '<meta name="viewport" content="width=750, user-scalable=no">' +
-              '<meta name="apple-mobile-web-app-capable" content="yes" />' +
-              '<meta name="apple-mobile-web-app-status-bar-style" 
content="black" />' +
-              '<meta name="apple-touch-fullscreen" content="yes" />' +
-              '<meta name="format-detection" content="telephone=no, email=no" 
/>' +
-              '<style>' +
-                'html, body {' +
-                  'height: 100%;' +
-                  'width: 100%;' +
-                '}' +
-              '</style>' +
-              '<script 
src="https://unpkg.com/vue/dist/vue.runtime.js";></script>' +
-              '<script 
src="https://unpkg.com/[email protected]/dist/index.min.js";></script>' +
-            '</head>' +
-            '<body>' +
-              '<div id="root"></div>' +
-              '<script>' +
-                  'var url = window.parent.WEB_BUNDLE_URL;' +
-                  'var jsTag = document.createElement("script");' +
-                  'jsTag.src = url;' +
-                  'document.body.appendChild(jsTag);' +
-              '</script>' +
-            '</body>' +
-            '</html>'
-
-
-  var iframe = document.getElementById('iframe')
-  var doc = iframe.contentDocument || iframe.contentWindow.document
-
-  doc.write(str)
-}());
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/749cf999/themes/weex/source/js/examples.min.js
----------------------------------------------------------------------
diff --git a/themes/weex/source/js/examples.min.js 
b/themes/weex/source/js/examples.min.js
new file mode 100644
index 0000000..764aa4f
--- /dev/null
+++ b/themes/weex/source/js/examples.min.js
@@ -0,0 +1 @@
+!function(e){var t={};function a(s){if(t[s])return t[s].exports;var 
c=t[s]={i:s,l:!1,exports:{}};return 
e[s].call(c.exports,c,c.exports,a),c.l=!0,c.exports}a.m=e,a.c=t,a.d=function(e,t,s){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:s})},a.r=function(e){"undefined"!=typeof
 
Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return
 e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var 
s=Object.create(null);if(a.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof
 e)for(var c in e)a.d(s,c,function(t){return e[t]}.bind(null,c));return 
s},a.n=function(e){var t=e&&e.__esModule?function(){return 
e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return 
Object.prototype.hasOwnProperty.call(e,t)},a.p="",a(a.s=1)}([function(e,t,a){const
 s=a(7),c=a(6),n=a(5),o=a(4),h=a(3),i=a(2),p=[s,c,n,o,h,i];funct
 ion 
l(e,t){return!(!e.scope||!t||e.scope===t)||!!e.ignore}e.exports=function(e={}){let
 t=p;const 
a=e.scope;return"mobile"===a&&(t=[s,c,n],i.group.unshift(...h.group),i.group.unshift(...o.group),t.push(i)),t.filter(t=>!l(t,a)&&(t.group=t.group.filter(t=>!l(t,a)&&(t.examples=t.examples.filter(t=>!(e.filterTODO&&(d=t,""===d.hash||"4624d605004fc7eb9f14ca9c5a226fe3"===d.hash||"ccefdea9e9ef695acca7fb1b439277e2"===d.hash||"123b69b57e099036558745298fb6e8ca"===d.hash||"2d8da136e33f63a0bfe4b1e42362405b"===d.hash||"e0025d9264cb5e6dec13710a5899a0a1"===d.hash)||l(t,a))),!!t.examples.length)),!!t.group.length));var
 d}},function(e,t,a){"use strict";a.r(t);var s=function(){var 
e=this,t=e.$createElement,a=e._self._c||t;return 
a("div",{staticClass:"article-wrapper"},[a("aside",{class:["doc-nav","aside",e.language]},[e._m(0),e._v("
 "),a("ul",{staticClass:"tab-list"},e._l(e.tabs,function(t){return 
a("li",{key:t.type,class:["tab-item",e.currentTab===t.type?"active-tab":""],on:{click:function(a){e.toggle
 
Tab(t.type)}}},[a("span",{staticClass:"tab-title"},[e._v(e._s(e._f("i18n")(t.name)))])])}))]),e._v("
 
"),a("example-list",{staticClass:"article",attrs:{language:e.language,type:e.currentTab,category:e.selectedCategory}})],1)};s._withStripped=!0;var
 c=a(0),n=a.n(c),o=function(){var 
e=this,t=e.$createElement,a=e._self._c||t;return 
a("main",{ref:"container",staticClass:"example-panel"},e._l(e.category.group,function(t,s){return
 
a("section",{key:t.type+"-"+s,staticClass:"example-section"},[a("h2",{ref:t.type,refInFor:!0,staticClass:"title",on:{click:function(a){e.scrollTo(t.type)}}},[e._v(e._s(e._f("i18n")(t.title||t.name)))]),e._v("
 
"),t.desc||t.docLink?a("p",{staticClass:"desc"},[t.desc?a("span",{staticClass:"text"},[e._v(e._s(e._f("i18n")(t.desc)))]):e._e(),e._v("
 
"),t.docLink?a("a",{staticClass:"link",attrs:{href:e._f("relative")(e._f("i18n")(t.docLink))}},[e._v("Read
 more")]):e._e()]):e._e(),e._v(" 
"),a("div",{staticClass:"example-list"},e._l(t.examples,function(t){return 
a("figure"
 
,{key:e._f("i18n")(t.hash),staticClass:"example-card"},[a("a",{staticClass:"preview",attrs:{target:"_blank",href:e._f("url")(e._f("i18n")(t.hash))}},[a("img",{staticClass:"screenshot",attrs:{src:e._f("i18n")(t.screenshot)}})]),e._v("
 
"),a("figcaption",{staticClass:"message"},[e._v(e._s(e._f("i18n")(t.title)))])])}))])}))};function
 h(e,t,a,s,c,n,o,h){var i,p="function"==typeof 
e?e.options:e;if(t&&(p.render=t,p.staticRenderFns=a,p._compiled=!0),s&&(p.functional=!0),n&&(p._scopeId="data-v-"+n),o?(i=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof
 
__VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),c&&c.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},p._ssrRegister=i):c&&(i=h?function(){c.call(this,this.$root.$options.shadowRoot)}:c),i)if(p.functional){p._injectStyles=i;var
 l=p.render;p.render=function(e,t){return i.call(t),l(e,t)}}else{var 
d=p.beforeCreate;p.beforeCreate=d?[].co
 ncat(d,i):[i]}return{exports:e,options:p}}o._withStripped=!0;var 
i=h({props:["type","category","language"],filters:{url:e=>`http://dotwe.org/vue/${e}`},methods:{scrollTo(e){e||(e=this.parseHash().hash);const
 
t=this.$refs.container,a=this.$refs[e];a&&a.length?(t.scrollTop=a[0].offsetTop,"undefined"!=typeof
 
location&&(location.hash=`#${this.type}/${e}`)):t.scrollTop=0}},mounted(){this.scrollTo()},updated(){this.scrollTo()}},o,[],!1,null,null,null);i.options.__file="examples/website/ExampleList.vue";var
 p=i.exports;const l=n()({filterTODO:!1});var 
d=h({components:{ExampleList:p},data:()=>({currentTab:"component",language:Vue.config.language||"en"}),computed:{tabs:()=>Array.isArray(l)?l.map(e=>{const
 t=Object.assign({},e);return delete t.group,t}):[],selectedCategory(){return 
Array.isArray(l)?l.filter(e=>e.type===this.currentTab)[0]:{}}},methods:{toggleTab(e,t){this.tabs.some(t=>t.type===e)&&e!==this.currentTab&&(this.currentTab=e,"undefined"!=typeof
 location&&(location.hash=`#${e}`+(t?
 `/${t}`:"")))}}},s,[function(){var 
e=this.$createElement,t=this._self._c||e;return 
t("div",{staticClass:"github"},[t("a",{staticClass:"repo-link",attrs:{href:"https://github.com/apache/incubator-weex-site/tree/master/examples",target:"_blank"}},[t("img",{staticClass:"github-logo",attrs:{src:"https://img.alicdn.com/tfs/TB1ciMDbwvD8KJjy0FlXXagBFXa-120-120.png",alt:"apache/incubator-weex-site"}})])])}],!1,null,null,null);d.options.__file="examples/website/IndexPage.vue";var
 r=d.exports;const f=window.currentLanguage||navigator.language;function 
X(e){return"string"==typeof e?e:"[object 
Object]"===Object.prototype.toString.call(e)?e[Vue.config.language||"en"]||"":void
 0}function m(){if("undefined"==typeof location||!location.hash)return{};const 
e=/^#(\w+)(\/([-_+\w]+))?/.exec(location.hash);return{tab:e[1],hash:e[3]}}Vue.config.language=f.match(/^zh[_-]?\w*$/i)?"zh":"en",Vue.filter("i18n",X),Vue.filter("relative",function(e){const
 t=new URL(e);return t.hostname,location.hostname,t.pathna
 
me}),Vue.mixin({methods:{i18n:X,parseHash:m},watch:{language(){Vue.config.language=this.language,this.$forceUpdate()}}}),r.el="#root";const
 b=new Vue(r);function 
g(){const{tab:e,hash:t}=m();b.toggleTab(e,t)}window.onhashchange=g,g()},function(e,t){e.exports={type:"others",name:{zh:"å
…
¶ä»–",en:"Others"},group:[{type:"utils",name:{zh:"功能",en:"Utils"},examples:[{hash:"3abe25e7dd6d52bf35edffd62ac6199e",title:{zh:"获取环境信息",en:"Environment"},screenshot:"https://gw.alicdn.com/tfs/TB1yJC8cEgQMeJjy0FjXXaExFXa-540-844.png"},{hash:"b3c0d8b5b3753f028cc84a55a29b2b6a",title:{zh:"功能检测",en:"Feature
 
Detect"},screenshot:"https://gw.alicdn.com/tfs/TB1TOGuc3MPMeJjy1XdXXasrXXa-540-844.png"},{scope:"website",hash:"071c9372edea9530546b6fb61201702f",title:{zh:"支持
 WebAssembly？",en:"Support 
WebAssembly?"},screenshot:"https://gw.alicdn.com/tfs/TB1cHyefwMPMeJjy1XbXXcwxVXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"自定义字体",en:"iconfont"},screenshot:"h
 
ttps://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"learn",scope:"website",name:{zh:"å­¦ä¹
 
",en:"Learn"},examples:[{hash:{zh:"43ede9db84425bce17e598456758eb3b",en:"82c3e1768163ae0155b436ce5d5f5640"},title:{zh:"å­¦ä¹
  Weex",en:"Learn 
Weex"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB13VkjhMoQMeJjy0FnXXb8gFXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB1EJuGbY_I8KJjy1XaXXbsxpXa-540-844.png"}},{hash:{zh:"59958038a2009d3eefca29da107d3e7d",en:"4f0456987961d45bb5cc0b3f14f92c02"},title:{zh:"å­¦ä¹
  Vue.js",en:"Learn 
Vue.js"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB1kfEAhMoQMeJjy0FoXXcShVXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB1JBjEXyqAXuNjy1XdXXaYcVXa-540-844.png"}},{hash:{zh:"d1426e1cd14718ebff51ea46bdae0224",en:"e7ea10acfc29f8a08fd75f9fa80f9703"},title:{zh:"å­¦ä¹
  Javascript",en:"Learn 
Javascript"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB1Dz3dhMoQMeJjy1XaXXcSsFXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB1JljEXyqAXuNjy1XdXXaYcVXa-540-844.png"}}
 
,{hash:{zh:"8d2a4e9b2e8e6f1d25d08472f3bb48cf",en:"1190538862e882f9bfa96bf3787aa879"},title:{zh:"å­¦ä¹
  CSS",en:"Learn 
CSS"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB10LcihMoQMeJjy0FpXXcTxpXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB1m3Ksb8fH8KJjy1XbXXbLdXXa-540-844.png"}},{hash:"ffec8fcae798c1bc1dfb0259b125f477",title:{zh:"手把手教ä½
 â€¦",en:"Step by 
Step"},screenshot:"https://gw.alicdn.com/tfs/TB1RfgihMoQMeJjy0FpXXcTxpXa-540-844.png"}]},{type:"flatten-benchmark",scope:"website",name:{zh:"平铺压测",en:"Flatten
 
Benchmark"},examples:[{hash:"ae5fd588a6522ebb62c8cc9fa049098b",title:{zh:"节点
 838",en:"838 
Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB1BVwkcMoQMeJjy0FoXXcShVXa-540-844.png"},{hash:"b881a66eaa1133778940bb59836b9635",title:{zh:"节点
 2296",en:"2296 
Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB1.OsgcMoQMeJjy0FnXXb8gFXa-540-844.png"},{hash:"3fa4de0a3e7dab86d9d8aa2ad380c677",title:{zh:"节点
 3295",en:"3295 Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB
 
1qgsccUgQMeJjy0FiXXXhqXXa-540-844.png"},{hash:"01706667abe088ba534cdc0bdb3bb23b",title:{zh:"节点
 5833",en:"5833 
Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB1leA3cCFRMKJjy0FhXXX.xpXa-540-844.png"},{hash:"ae643775651ca4190c3250ce0a1ea1fb",title:{zh:"节点
 8990",en:"8990 
Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB1o0AicMoQMeJjy0FnXXb8gFXa-540-844.png"},{hash:"aacd3f0c12d7a2befc7c9de9986227a7",title:{zh:"节点
 12948",en:"12948 
Nodes"},screenshot:"https://gw.alicdn.com/tfs/TB1glklcMoQMeJjy0FoXXcShVXa-540-844.png"}]},{type:"layer-benchmark",scope:"website",name:{zh:"层级压测",en:"Layer
 
Benchmark"},examples:[{hash:"33c93497fe648eeb3bd5a8b9eb709977",title:{zh:"层级
 100",en:"100 
Layers"},screenshot:"https://gw.alicdn.com/tfs/TB1G2T7cMMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"6ee24082dae44130bbedf1970f67fc35",title:{zh:"层级
 200",en:"100 
Layers"},screenshot:"https://gw.alicdn.com/tfs/TB1kLZicMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4455c5fc1155d294b8ea147cd1e677c8",title:{z
 h:"层级 500",en:"500 
Layers"},screenshot:"https://gw.alicdn.com/tfs/TB1H1z8cMMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"ba59f9a74547f709dd4e8d6fa7dccbae",title:{zh:"层级
 1000",en:"1000 
Layers"},screenshot:"https://gw.alicdn.com/tfs/TB1I1z8cMMPMeJjy1XdXXasrXXa-540-844.png"}]},{type:"composed-benchmark",scope:"website",name:{zh:"混合压测",en:"Composed
 Benchmark"},examples:[{hash:"c4849fe9950c03bbb59f1ac7660b9430",title:"10 x 
10",screenshot:"https://gw.alicdn.com/tfs/TB1YGouihrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"08b7bd34da310cc3a173bef5be8aee68",title:"15
 x 
15",screenshot:"https://gw.alicdn.com/tfs/TB1oPMVibYI8KJjy0FaXXbAiVXa-540-844.png"},{hash:"41cc7b9a252d7cd88233b5e70e633ae5",title:"20
 x 
20",screenshot:"https://gw.alicdn.com/tfs/TB1kbvSilfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"290873a8734eecf4d7d8060e0f34bc4a",title:"25
 x 
25",screenshot:"https://gw.alicdn.com/tfs/TB1oTkJifDH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"bf5e9e6bb1f4a8a451e638165aca586d",title:"30
 x 30",screenshot:"h
 
ttps://gw.alicdn.com/tfs/TB1LGQZib_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"80ea75498c49406c5493b596baa738e9",title:"40
 x 
40",screenshot:"https://gw.alicdn.com/tfs/TB1uGnQilfH8KJjy1XbXXbLdXXa-540-844.png"}]},{type:"case-benchmark",name:{zh:"实例压测",en:"Real
 Case 
Benchmark"},examples:[{hash:"8fb49bf98996a9f26f4f8123b40d763c",title:"<list>",screenshot:"https://gw.alicdn.com/tfs/TB1JGrQilfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"cbffa887a26cb040c10c56117bcfd655",title:";<scroller>",screenshot:"https://gw.alicdn.com/tfs/TB1JGrQilfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"5c705064c078296bd0e6a2ee94963af7",title:";<recycle-list>",screenshot:"https://gw.alicdn.com/tfs/TB1JGrQilfH8KJjy1XbXXbLdXXa-540-844.png"}]}]}},function(e,t){e.exports={type:"cases",name:{zh:"实例",en:"Cases"},group:[{type:"useful",name:{zh:"常用",en:"Common
 
Cases"},examples:[{hash:"123b69b57e099036558745298fb6e8ca",title:{zh:"楼层电梯",en:"Elevator"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa
 
-540-844.png"},{hash:"123b69b57e099036558745298fb6e8ca",title:{zh:"返回顶部",en:"Back
 to 
Top"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"123b69b57e099036558745298fb6e8ca",title:{zh:"网æ
 ¼å¸ƒå±€",en:"Grid 
Layout"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"123b69b57e099036558745298fb6e8ca",title:{zh:"模态框",en:"Modal
 
Box"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"123b69b57e099036558745298fb6e8ca",title:{zh:"å
…¨å±é®ç½©",en:"Fullscreen 
Mask"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"tabs",name:{zh:"多页签",en:"Tabs"},examples:[{hash:"c5f7cb6cc90fe4883436534167563dd3",title:{zh:"Tab
 
页签",en:"Tabs"},screenshot:"https://gw.alicdn.com/tfs/TB1mfmunC_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"643ac211e70a3c733f1d2ef848b3e7f0",title:{zh:"带å†
…容",en:"Tabs and Panels"},screenshot:"https://gw.alicdn.
 
com/tfs/TB1l0aTnxrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"多个页签实例",en:"<embed>"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"手势滑动",en:""},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"spa",ignore:!0,name:{zh:"单页应用",en:"Single
 Page 
App"},examples:[{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"使用 
Vuex",en:"Using 
Vuex"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"使用
 vue-router",en:"Using 
vue-router"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"单页应用",en:"Single
 Page 
App"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"real-cases",name:{zh:"完整例子";
 ,en:"Examples"},examples:[{hash:"3a52d415dc7307d1594079574fe553c7",title:"Todo 
List",screenshot:"https://gw.alicdn.com/tfs/TB182b_bNrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"936b7e8a504abd5b3e2f5a8d91accc5e",title:{zh:"华容道",en:"Klotski"},screenshot:"https://gw.alicdn.com/tfs/TB13Yw1af6H8KJjy0FjXXaXepXa-540-844.png"},{hash:"82ff22e820405194004aacae8045ad56",title:{zh:"计算器",en:"Calculator"},screenshot:"https://gw.alicdn.com/tfs/TB1tXOrc3MPMeJjy1XcXXXpppXa-540-844.png"},{hash:{zh:"c0b65802869aebb7627ceaba56e51d1e",en:"263b8a4226b4a161d3e1b89f6ffcd39a"},title:{zh:"扫ç
 äºŒç»´ç ",en:"Scan QR 
Code"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB1ew4FX1uSBuNjy1XcXXcYjFXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB1KqLnX_tYBeNjy1XdXXXXyVXa-540-844.png"}},{hash:"6f06da96ecc0d06673f9dd70e01d6749",title:{zh:"扫雷",en:"MineSweeper"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"reprography",scope:"website",name:{zh:"简单复刻",en:"Rep
 
rography"},examples:[{ignore:!0,hash:"8ee2850f39123a350333eb08beac7115",title:{zh:"朋友圈",en:"Moment"},screenshot:"https://gw.alicdn.com/tfs/TB1G7LydwMPMeJjy1XdXXasrXXa-540-844.png"},{scope:"website",hash:"013b1e76d2c5419e32bc3e02aa1bef26",title:"应用列表",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"6c458803b2a83a336099ff43dae4d1a5",title:"商品展示",screenshot:"https://gw.alicdn.com/tfs/TB1juElXjihSKJjy0FfXXbGzFXa-540-844.png"},{hash:"97c0dc80f34d51aff2551a9916d48fba",title:{zh:"聊天",en:"Chat"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]}]}},function(e,t){e.exports={type:"styles",name:{zh:"æ
 ·å¼",en:"Styles"},group:[{type:"basics",name:{zh:"基本样式",en:"Basic 
Styles"},examples:[{hash:"5219829fd0a5f59dc9208c8327e02e92",title:{zh:"position 
布局",en:"Position 
Layout"},screenshot:"https://gw.alicdn.com/tfs/TB1CCP1ewMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"d1648814d06fdf59cd99ea92c7166
 94a",title:{zh:"线性渐变",en:"Linear 
Gradient"},screenshot:"https://gw.alicdn.com/tfs/TB1JQCEhgoQMeJjy1XaXXcSsFXa-540-844.png"},{hash:"94a627f3ffa7007f3a2e9c97a5e245ec",title:{zh:"阴影",en:"Box
 
Shadow"},screenshot:"https://gw.alicdn.com/tfs/TB1J7goczihSKJjy0FlXXadEXXa-540-844.png"},{hash:"e68f268dffcf0481935e19c9b0ab315f",title:{zh:"伪类选择器",en:"Pseudo-classes"},screenshot:"https://gw.alicdn.com/tfs/TB1J7goczihSKJjy0FlXXadEXXa-540-844.png"},{hash:"bb3afbc65afb96e4099a8b6b6a03185a",title:{zh:"网æ
 ¼èƒŒæ™¯",en:"Mesh 
Background"},screenshot:"https://gw.alicdn.com/tfs/TB1kU3abRTH8KJjy0FiXXcRsXXa-540-844.png"},{hash:"e510f73afb31b3228a5a9ef1b7a5a456",title:{zh:"透明背景",en:"Transparent
 
Background"},screenshot:"https://gw.alicdn.com/tfs/TB1CL3nbMDD8KJjy0FdXXcjvXXa-540-844.png"},{hash:"b90dbc5fbecf160a8f6c10b752b44c53",title:{zh:"三角形",en:"Triangles"},screenshot:"https://gw.alicdn.com/tfs/TB14yzscMvD8KJjy0FlXXagBFXa-540-844.png"},{hash:"190d8baf578fb7b4efd82f19322a6
 9da",title:{zh:"西瓜（阴影）",en:"Watermelon 
(box-shadow)"},screenshot:"https://gw.alicdn.com/tfs/TB1RIzDdx6I8KJjy0FgXXXXzVXa-540-844.png"}]},{type:"flexbox",name:"Flexbox",title:{zh:"Flexbox
 布局",en:"Flexbox Layout"},desc:{zh:"CSS 弹性盒子布局是 CSS 
的模块之一，定义了一种针对用户界面设计而优化的 CSS 
盒子模型。在弹性布局模型中，弹性容器的子元素
可以在任何方向上排布，也可以“弹性伸缩”å…
¶å°ºå¯¸ï¼Œæ—¢å¯ä»¥å¢žåŠ 
尺寸以填满未使用的空间，也可以收缩尺寸以避免父元素
溢出。子元素
的水平对齐和垂直对齐都能很方便的进行操控。通过嵌套这些框（水平框在垂直框å†
…，或垂直框在水平框内
）可以在两个维度上构建布局。",en:"CSS Flexible Box Layout is a 
module of CSS that defines a CSS box model optimized for user interface design, 
and the layout of items in one dimension. In the flex layout model, the 
children of a flex container can be laid
  out in any direction, and can “flex” their sizes, either growing to fill 
unused space or shrinking to avoid overflowing the parent. Both horizontal and 
vertical alignment of the children can be easily 
manipulated."},docLink:{zh:"https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout",en:"https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout"},examples:[{hash:"fb3dbc872b4ccd068bc61a551c02dcc0",title:"flex-direction",screenshot:"https://gw.alicdn.com/tfs/TB1aIJHgMoQMeJjy0FpXXcTxpXa-540-844.png"},{hash:"4a7214eafa1c07190e81e2c41d30e030",title:"flex-wrap",screenshot:"https://gw.alicdn.com/tfs/TB1kQQeczihSKJjy0FlXXadEXXa-540-844.png"},{hash:"5fc9541e4c0a10484482ae7c539960ca",title:"justify-content",screenshot:"https://gw.alicdn.com/tfs/TB1PNNVgMoQMeJjy0FoXXcShVXa-540-844.png"},{hash:"fc795cfba02d44a895d3df603a675d78",title:"align-items",screenshot:"https://gw.alicdn.com/tfs/TB1ADdPgMMPMeJjy1XcXXXpppXa-540-844.png"},{scope:"website",hash:"0650d1e5
 
f089254de707a4af6ea1d736",title:"flex-flow",screenshot:"https://gw.alicdn.com/tfs/TB1qktHgMoQMeJjy0FnXXb8gFXa-540-844.png"},{scope:"website",hash:"cac1573b8689adbfceecf58f4293654c",title:"order",screenshot:"https://gw.alicdn.com/tfs/TB1qMv.cqagSKJjy0FhXXcrbFXa-540-844.png"},{hash:"301f115bc9cb5d62c21e4f5272a3491d",title:"align-self",screenshot:"https://gw.alicdn.com/tfs/TB1qDBGgMMPMeJjy1XbXXcwxVXa-540-844.png"},{scope:"website",hash:"bdee705206b8d2a447a51dc3b81fa6d8",title:"align-content",screenshot:"https://gw.alicdn.com/tfs/TB1OQIeczihSKJjy0FlXXadEXXa-540-844.png"},{scope:"website",hash:"148cef9b572617067b8cfe208b8e93db",title:"flex-grow",screenshot:"https://gw.alicdn.com/tfs/TB1vvVCgMoQMeJjy1XaXXcSsFXa-540-844.png"},{scope:"website",hash:"4149549dbfbef3f6090ff0711f016263",title:"flex-shrink",screenshot:"https://gw.alicdn.com/tfs/TB1QvVCgMoQMeJjy1XaXXcSsFXa-540-844.png"},{scope:"website",hash:"b23c7139b09cfc99e6df3dd0a9f7b326",title:"flex-basis",screenshot:"https://gw.alicdn.com/t
 
fs/TB14h8mb2xNTKJjy0FjXXX6yVXa-540-844.png"}]}]}},function(e,t){e.exports={type:"syntax",name:{zh:"语法",en:"Syntax"},group:[{type:"text-binding",name:{zh:"文本绑定",en:"Text
 Binding"},title:{zh:"文本绑定",en:"Text 
Binding"},desc:{zh:"数据绑定最常见的形式就是使用 “Mustache” 
语法（双大括号）的文本插值。",en:"The most basic form of data 
binding is text interpolation using the “Mustache” syntax (double curly 
braces)."},docLink:{zh:"https://cn.vuejs.org/v2/guide/syntax.html#插值",en:"https://vuejs.org/v2/guide/syntax.html#Interpolations"},examples:[{hash:{zh:"34e42c91e1f86591563ec8897e6a095c",en:"207411d00e8af32213443b4d0c5db689"},title:{zh:"文本插值",en:"Inline
 
TextNode"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB1V5IXcMMPMeJjy1XdXXasrXXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB19gKsb8fH8KJjy1XbXXbLdXXa-540-844.png"}},{hash:"68b02a5371eb7da5cb9dde1946ce2b68",title:{zh:"使用表达式",en:"Using
 Expression"},screenshot:"https:/
 
/gw.alicdn.com/tfs/TB1veLGbS_I8KJjy0FoXXaFnVXa-540-844.png"}]},{type:"v-bind",name:"v-bind",title:{zh:"绑定属性值（v-bind）",en:"v-bind"},desc:{zh:"v-bind
 可以动态地绑定一个或多个特性，或一个组件 prop 
到表达式。可以简写成 `:` (半角冒号)。",en:"Dynamically bind one 
or more attributes, or a component prop to an 
expression."},docLink:{zh:"https://cn.vuejs.org/v2/api/#v-bind",en:"https://vuejs.org/v2/api/#v-bind"},examples:[{hash:"b62f1a5f4973f43fae9adca02864eb8b",title:{zh:"绑定属性值",en:"Binding
 
Props"},screenshot:"https://gw.alicdn.com/tfs/TB150aYcMoQMeJjy0FpXXcTxpXa-540-844.png"},{hash:"b142f24d2f0ab27f5f65448d2aa16970",title:{zh:"绑定表达式",en:"Using
 
Expression"},screenshot:"https://gw.alicdn.com/tfs/TB1veLGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"3a2cc3c7a465f6a07c4bd3a868c7e393",title:{zh:"æ
 ·å¼å€¼ç»‘定",en:"Style 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1o.62bH_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"2bc0de9ec2448a
 1f852f354349f66600",title:{zh:"类名绑定",en:"Class 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1o.62bH_I8KJjy1XaXXbsxpXa-540-844.png"}]},{type:"v-for",name:"v-for",title:{zh:"循环指令（v-for）",en:"v-for"},desc:{zh:"v-for
 基于源数据多次渲染元素或模板块。此指令之值，必
须使用特定语法 `alias in expression` 为当前遍历的元素
提供别名。",en:"We can use the v-for directive to render a `alias in 
expression` based on an array. The v-for directive requires a special syntax in 
the form of item in 
items."},docLink:{zh:"https://cn.vuejs.org/v2/guide/list.html",en:"https://vuejs.org/v2/guide/list.html"},examples:[{hash:"38904c807f66b1a11de5ddf0d40b3d30",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1R_7.bjihSKJjy0FlXXadEXXa-540-844.png"},{hash:"2cd124954175721d9145571bf722ce7a",title:{zh:"下æ
 ‡ç´¢å¼•",en:"Array 
Index"},screenshot:"https://gw.alicdn.com/tfs/TB1dAivaLBNTKJjy0FdXXcPpVXa-540-844.png"},{hash:"2b
 4222b828fac65257d9ed9f8932f2a1",title:{zh:"遍历 JS 对象",en:"v-for With an 
Object"},screenshot:"https://gw.alicdn.com/tfs/TB10r25bH_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"7364e9c3c25ab2cbc945903cea7b0878",title:{zh:"多层循环",en:"Multiple
 
v-for"},screenshot:"https://gw.alicdn.com/tfs/TB1giSLfwoQMeJjy0FoXXcShVXa-540-844.png"}]},{type:"v-if",name:"v-if",title:{zh:"条件指令（v-if)",en:"v-if"},desc:{zh:"v-if
 根据表达式的值的真假条件渲染元素，在切换时元素
及它的数据绑定/组件被销毁并重建。同类指令还有 v-else 和 
v-else-if。",en:"Conditionally render the element based on the truthy-ness of 
the expression 
value."},docLink:{zh:"https://cn.vuejs.org/v2/guide/conditional.html",en:"https://vuejs.org/v2/guide/conditional.html"},examples:[{hash:"736a5dd112a1a114a559218ed20cae08",title:"v-if",screenshot:"https://gw.alicdn.com/tfs/TB1BAuGb2DH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"b6b244c4d8623565e77d9de324ca8de1",title:"v-else",screenshot:"ht
 
tps://gw.alicdn.com/tfs/TB1P.TpdxrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"22faff4ee6f235c0e8fb98b21c1ea662",title:"v-else-if",screenshot:"https://gw.alicdn.com/tfs/TB1P.TpdxrI8KJjy0FpXXb5hVXa-540-844.png"}]},{type:"v-on",name:"v-on",title:{zh:"事件绑定（v-on）",en:"v-on"},desc:{zh:"可以用
 v-on 指令监听 DOM 事件来触发一些 JavaScript 代ç 
ï¼Œå¯ä»¥ç®€å†™æˆ `@`。用在普通元素上时，只能监听 原生 DOM 
事件。用在自定义元素
组件上时，也可以监听子组件触发的自定义事件。",en:"We can 
use the v-on directive to listen to DOM events and run some JavaScript when 
they’re 
triggered."},docLink:{zh:"https://cn.vuejs.org/v2/guide/events.html#监听事件",en:"https://vuejs.org/v2/guide/events.html"},examples:[{hash:"a3607094a4bf73a069a5c51efb47fe98",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1dcTaewMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"8e3a1cbcf1ba9af94fe6f77e9668e354",title:{zh:"å†
…联语句",en:"I
 nline 
Statement"},screenshot:"https://gw.alicdn.com/tfs/TB1dcTaewMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"3a019f2eca4a6966ee0c3b91e5b2fc5b",title:{zh:"ä¼
 é€’参数",en:"Inline 
Handler"},screenshot:"https://gw.alicdn.com/tfs/TB1dcTaewMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"8581f4d2ff8fb48bdc547d2465c0cf24",title:{zh:"once
 修饰符",en:".once 
Modifier"},screenshot:"https://gw.alicdn.com/tfs/TB1dcTaewMPMeJjy1XdXXasrXXa-540-844.png"}]},{type:"v-model",name:"v-model",title:{zh:"表单双向绑定（v-model）",en:"v-model"},desc:{zh:"可以用
 v-model 指令在表单控件元素上创建双向数据绑定。它会æ 
¹æ®æŽ§ä»¶ç±»åž‹è‡ªåŠ¨é€‰å–正确的方法来更新元素
。尽管有些神奇，但 v-model 
本质上不过是语法糖，它负责监听用户的输å…
¥äº‹ä»¶ä»¥æ›´æ–°æ•°æ®ï¼Œå¹¶ç‰¹åˆ«å¤„理一些极端的例子。",en:"You can 
use the v-model directive to create two-way data bindings on form input and 
textarea elements. It automatically picks the correct way to update the 
 element based on the input 
type."},docLink:{zh:"https://cn.vuejs.org/v2/guide/forms.html",en:"https://vuejs.org/v2/guide/forms.html"},examples:[{hash:"e1e4413c5252dc763b01f26ce60d5ee4",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1IQ9cdgMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"39684e82ad9a8e0b175f49e058cf7af6",title:{zh:"绑定
 <textarea>",en:"Using 
<textarea>"},screenshot:"https://gw.alicdn.com/tfs/TB1y738XiqAXuNjy1XdXXaYcVXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"各种表单组件",en:""},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"v-once",name:"v-once",title:{zh:"一次性渲染（v-once）",en:"v-once"},desc:{zh:"只渲染å
…ƒç´ å’Œç»„件一次。随后的重新渲染,元素/组件及å…
¶æ‰€æœ‰çš„子节点将被视为静态内
容并跳过。这可以用于优化更新性能。",en:"Render the element and 
component once only. On subsequent re-renders, the element/component and a
 ll its children will be treated as static content and skipped. This can be 
used to optimize update 
performance."},docLink:{zh:"https://cn.vuejs.org/v2/api/#v-once",en:"https://vuejs.org/v2/api/#v-once"},examples:[{hash:"db5a71d3f621f32261a4208943358092",title:{zh:"使用
 v-once",en:"Using 
v-once"},screenshot:"https://gw.alicdn.com/tfs/TB1dcTaewMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"f66f49ad00f58ab8bd1fa580d27900f8",title:{zh:"不使用
 v-once",en:"Without 
v-once"},screenshot:"https://gw.alicdn.com/tfs/TB1cITaewMPMeJjy1XdXXasrXXa-540-844.png"}]},{type:"filters",name:"Filters",title:{zh:"过滤器（Filters）",en:"Filters"},desc:{zh:"Vue.js
 允许你自定义过滤器，可被用作一些常见的文本æ 
¼å¼åŒ–。过滤器可以用在两个地方：mustache 插值和 v-bind 
表达式。过滤器应该被添加在 JavaScript 
表达式的尾部，由“管道”符指示。",en:"Vue.js allows you to 
define filters that can be used to apply common text 
formatting."},docLink:{zh:"https
 
://cn.vuejs.org/v2/guide/filters.html",en:"https://vuejs.org/v2/guide/filters.html"},examples:[{hash:"28df0a4424a9e9fe1411020de20d52c0",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1U8nAdr_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"b4eac5ccef8ef954858e9ef0c6aca9d7",title:{zh:"ä¼
 é€’额外参数",en:"Pass 
Arguments"},screenshot:"https://gw.alicdn.com/tfs/TB1SV_adBfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"7b4a2ee438abe343b0a2f38556e730f1",title:{zh:"过滤器串联",en:"Chained
 
Filters"},screenshot:"https://gw.alicdn.com/tfs/TB1lETpdxrI8KJjy0FpXXb5hVXa-540-844.png"}]},{type:"mixins",name:"Mixins",title:{zh:"混合（Mixins）",en:"Mixins"},desc:{zh:"混合
 (mixins) 是一种分发 Vue 
组件中可复用功能的非常灵活的方式。混合对象可以包
含任意组件选项。以组件使用混合对象时，所有混合对象的选项将被混å
…¥è¯¥ç»„件本身的选项。",en:"Mixins are a flexible way to distribute 
reusable functionalities for Vue comp
 onents. A mixin object can contain any component options. When a component 
uses a mixin, all options in the mixin will be “mixed” into the 
component’s own 
options."},docLink:{zh:"https://cn.vuejs.org/v2/guide/mixins.html",en:"https://vuejs.org/v2/guide/mixins.html"},examples:[{hash:"c69cb31319ffe8e0b25543cfabcf06d6",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1HJHcdtfJ8KJjy0FeXXXKEXXa-540-844.png"},{hash:"804d427a56528c3dc2706e77b93df516",title:{zh:"å
…¨å±€æ··åˆ",en:"Global 
Mixin"},screenshot:"https://gw.alicdn.com/tfs/TB1HJHcdtfJ8KJjy0FeXXXKEXXa-540-844.png"},{hash:"92ab52525cb0d7d55d1ef007df90cf77",title:{zh:"生命周期混合",en:"Lifecycle
 
Mixin"},screenshot:"https://gw.alicdn.com/tfs/TB1bRLCdwDD8KJjy0FdXXcjvXXa-540-844.png"},{hash:"ee84c44bb3f4b23f83d52aecad30f8ea",title:{zh:"选项合并",en:"Mixin
 
Options"},screenshot:"https://gw.alicdn.com/tfs/TB1FUTpdxrI8KJjy0FpXXb5hVXa-540-844.png"}]},{type:"component",name:{zh:"组件",en:"Componen
 t"},title:{zh:"组件",en:"Component"},desc:{zh:"组件系统是 Vue 
的另一个重要概念，因为它是一种抽象，å…
è®¸æˆ‘们使用小型、独立和通常可复用的组件构建大型应用。仔细想想，å‡
 ä¹Žä»»æ„ç±»åž‹çš„应用界面都可以抽象为一个组件树。",en:"The 
component system is another important concept in Vue, because it’s an 
abstraction that allows us to build large-scale applications composed of small, 
self-contained, and often reusable components. If we think about it, almost any 
type of application interface can be abstracted into a tree of 
components"},docLink:{zh:"https://cn.vuejs.org/v2/guide/index.html#组件化应用构建",en:"https://vuejs.org/v2/guide/#Composing-with-Components"},examples:[{hash:"59aeb1600ee976ea61faf354a9fee299",title:{zh:"使用子组件",en:"Composing
 
Components"},screenshot:"https://gw.alicdn.com/tfs/TB12KPGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"3373a87306d0e0ccf463ac492aeb070c",title:{zh:"ä¼
 é€’属性",en
 :"Passing Data with 
Props"},screenshot:"https://gw.alicdn.com/tfs/TB12KPGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"b2ac35b0cc13c4c64c5adbfbeed5b3f7",title:{zh:"子组件的引用",en:"Child
 Component 
Refs"},screenshot:"https://gw.alicdn.com/tfs/TB12KPGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"多层子组件",en:"Deep
 Composed 
Components"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"生命周期",en:"Lifecycles"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"注册å
…¨å±€ç»„件",en:"Global 
Registration"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4c2eadc3fe105d643cd0ade59b3bde54",title:{zh:"递归组件",en:"Recursive
 
Components"},screenshot:"https://gw.alicdn.com/tfs/TB1U868icrI8KJjy0FhXXbfnpXa-540-844.png"},{hash:"ccefdea9e
 
9ef695acca7fb1b439277e2",title:{zh:"异步组件",en:""},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"å†
…
联模板",en:""},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"built-in",name:{zh:"å†
…置组件",en:"Built-in"},title:{zh:"内置组件",en:"Built-in 
Components"},examples:[{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"动态组件
 <component>",en:"Dynamic 
Components"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"用
 <slot> 分发内容",en:"Content Distribution with 
Slots"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"单个
 solt",en:"Single 
Slot"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:
 {zh:"具名 slot",en:"Named 
Slot"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:";<transition>",en:"<transition>"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:";<transition-group>",en:"<transition-group>"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"communication",name:{zh:"组件通信",en:"Communication"},title:{zh:"组件通信",en:"Component
 
Communication"},examples:[{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"自定义事件",en:"Custom
 
Events"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"父子组件通信",en:"Parent-Child
 
Communication"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"è
 ¡¨å•ç»„件传值",en:"Form 
Components"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"ccefdea9e9ef695acca7fb1b439277e2",title:{zh:"非父子组件通信",en:"Non
 Parent-Child 
Communication"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]}]}},function(e,t){e.exports={type:"module",name:{zh:"模块",en:"Module"},group:[{type:"modal",name:"modal",title:{zh:"modal
 模块",en:"modal"},desc:{zh:"modal 模块提供了以下展示消息框的 
API：toast、alert、confirm 和 prompt。",en:"Weex provides a series of 
message boxes: toast, alert, confirm and 
prompt."},docLink:{zh:"http://weex-project.io/cn/references/modules/modal.html",en:"http://weex-project.io/references/modules/modal.html"},examples:[{hash:"5e49976681ea1ae7bbcbce4c92b7771f",title:"toast",screenshot:"https://gw.alicdn.com/tfs/TB1TPWcdogQMeJjy0FiXXXhqXXa-540-844.png"},{hash:"d00060031b25fbfbdffdbf08b5524e51",title:"alert",screenshot:"https://gw.alic
 
dn.com/tfs/TB1JsqddgoQMeJjy1XaXXcSsFXa-540-844.png"},{hash:"88b0782ba54695a66622988bfeb89fbd",title:"confirm",screenshot:"https://gw.alicdn.com/tfs/TB1PWmedogQMeJjy0FjXXaExFXa-540-844.png"},{hash:"7763e5b0322cf625ec5221dea13ea5ec",title:"prompt",screenshot:"https://gw.alicdn.com/tfs/TB13B9gdgoQMeJjy0FpXXcTxpXa-540-844.png"}]},{type:"dom",name:"dom",title:{zh:"dom
 模块",en:"dom"},desc:{zh:"操作页面中的节点或者获取å…
¶ä¿¡æ¯ã€‚需要注意的是原生平台中并没有 Web 标准中的 DOM 
结构。",en:"A series of dom apis that sending virtual-dom’s messages to 
the native renderer to update the dom 
tree."},docLink:{zh:"http://weex-project.io/cn/references/modules/dom.html",en:"http://weex-project.io/references/modules/dom.html"},examples:[{hash:"14df0c05474fd16d4690e22194a69599",title:"scrollTo",screenshot:"https://gw.alicdn.com/tfs/TB1ZIPecwoQMeJjy0FoXXcShVXa-540-844.png"},{hash:"13afb9ed3e3a79eda435113478fd83d9",title:"getComponentRect",screenshot:"https://gw.alicdn
 
.com/tfs/TB1v5zscMvD8KJjy0FlXXagBFXa-540-844.png"},{hash:"308d627e241d0ce932a1577672af1bd8",title:"addRule",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"stream",name:"stream",title:{zh:"stream
 模块",en:"stream"},desc:{zh:"发送网络请求并获取响应。",en:"A 
series of stream api. It provides a network 
request."},docLink:{zh:"http://weex-project.io/cn/references/modules/stream.html",en:"http://weex-project.io/references/modules/stream.html"},examples:[{hash:"2ae062b6a04124a35bbe2da3b1e5c07b",title:"fetch",screenshot:"https://gw.alicdn.com/tfs/TB1SAFdbLDH8KJjy1XcXXcpdXXa-540-844.png"}]},{type:"animation",name:"animation",title:{zh:"animation
 模块",en:"animation"},desc:{zh:"animation 
模块被用于在组件上执行动画。动画可以对组件执行一系列简单的变换
 (位置、大小、旋转角度、背景颜色和不透明度等)。",en:"The 
animation module is used to perform animation on components."},docLink:{zh:"htt
 
p://weex-project.io/cn/references/modules/animation.html",en:"http://weex-project.io/references/modules/animation.html"},examples:[{hash:"07554ce87a2c70d77bf2265824afdd8a",title:{zh:"最简例子",en:"Sample"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:"transform",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"navigator",name:"navigator",title:{zh:"navigator
 
模块",en:"navigator"},desc:{zh:"众所周知，在浏览器里，我们可以通过前进或è€
…回退按钮来切换页面，iOS/Android 的 navigator 
模块就是用来实现类似的效果的。除了前进、回退功能，该模块还å
…è®¸æˆ‘们指定在切换页面的时候是否应用动画效果。",en:"As 
it’s known to all that, we can navigate back and forth in the web browser 
using the navigation bar. And The navigator module mimics the same behaviors in 
the iOS/Android application."},docL
 
ink:{zh:"http://weex-project.io/cn/references/modules/navigator.html",en:"http://weex-project.io/references/modules/navigator.html"},examples:[{hash:"28815dba72ee4091dfdb471f3b294e3e",title:"push",screenshot:"https://gw.alicdn.com/tfs/TB1Wh_CcILJ8KJjy0FnXXcFDpXa-540-844.png"},{hash:"2af40e54aeef15228cb221c3cd57ae8f",title:"pop",screenshot:"https://gw.alicdn.com/tfs/TB1syzscMvD8KJjy0FlXXagBFXa-540-844.png"}]},{type:"storage",name:"storage",title:{zh:"storage
 模块",en:"storage"},desc:{zh:"storage 
模块可以对本地数据进行存储、修改、删
除，并且该数据是永久保存的，除非手动清除或者代码清
除。但是，storage 
模块有一个限制就是浏览器端（H5）只能存储小于5M的数据，而在
 Android 和 iOS 中是没什么限制的。",en:"storage is a series of apis, 
allowing you to for example add, modify or delete stored data 
items."},docLink:{zh:"http://weex-project.io/cn/references/modules/storage.html",en:"http://weex-project.io/reference
 
s/modules/storage.html"},examples:[{hash:"71d1dff37c54fa9bafab4d8cbe3d21e3",title:"setItem",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"71d1dff37c54fa9bafab4d8cbe3d21e3",title:"getItem",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"71d1dff37c54fa9bafab4d8cbe3d21e3",title:"removeItem",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"clipboard",name:"clipboard",title:{zh:"clipboard
 模块",en:"clipboard"},desc:{zh:"clipboard 
模块可以实现从系统的剪贴板中获取内容或者设置内
容。",en:"clipboard allows you to getString() or setString() from the system 
clipboard."},docLink:{zh:"http://weex-project.io/cn/references/modules/clipboard.html",en:"http://weex-project.io/references/modules/clipboard.html"},examples:[{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1X
 
cXXXpppXa-540-844.png"},{hash:"3abe25e7dd6d52bf35edffd62ac6199e",title:{zh:"复制环境信息",en:"Copy
 Environment 
Message"},screenshot:"https://gw.alicdn.com/tfs/TB1yJC8cEgQMeJjy0FjXXaExFXa-540-844.png"}]},{type:"picker",name:"picker",title:{zh:"picker
 模块",en:"picker"},desc:{zh:"以下为 picker 相关的 
API：用于数据选择，日期选择，时间选择。（ 
H5模块如需使用，请手动引入weex-picker组件）",en:"A series of 
stream api. It provides function: pick data, pick date, pick 
time."},docLink:{zh:"http://weex-project.io/cn/references/modules/picker.html",en:"http://weex-project.io/references/modules/picker.html"},examples:[{hash:"eddde63fc2f57debed15d4f0eaf38d7e",title:"pick",screenshot:"https://gw.alicdn.com/tfs/TB128rrcL6H8KJjy0FjXXaXepXa-540-844.png"},{hash:"e71e82157a8c65b33ac213a6a399c971",title:"pickDate",screenshot:"https://gw.alicdn.com/tfs/TB1gybCcILJ8KJjy0FnXXcFDpXa-540-844.png"},{hash:"cd8cae300c4b02d3e6f6f7ba54307029",title:"pickTime",screen
 
shot:"https://gw.alicdn.com/tfs/TB1TyzscMvD8KJjy0FlXXagBFXa-540-844.png"}]},{type:"webview",name:"webview",title:{zh:"webview
 模块",en:"webview"},desc:{zh:"一系列的 <web> 组件操作接口。 
比如 goBack、goForward、和 reload。通常与 <web> 组件共用。",en:"A 
series of web operation api like goBack, goForward, and reload. ‘webview’ 
module used with the web 
component."},docLink:{zh:"http://weex-project.io/cn/references/modules/webview.html",en:"http://weex-project.io/references/modules/webview.html"},examples:[{hash:"9f8a7be89a4ad881ff515145cc9306ea",title:"goBack",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"9f8a7be89a4ad881ff515145cc9306ea",title:"goForward",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"},{hash:"9f8a7be89a4ad881ff515145cc9306ea",title:"reload",screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"meta",name:"meta",title:{zh:"meta
 æ¨
 ¡å—",en:"meta"},desc:{zh:"meta 模块可用于声明单个页面的å…
ƒä¿¡æ¯ï¼Œé€šå¸¸æ˜¯ä¸€äº›é¡µé¢çš„配置，如容器的显示宽度 (viewport) 
等。",en:"The meta module can be used to declare meta information for a 
single page, such as the viewport of the 
container."},docLink:{zh:"http://weex-project.io/cn/references/modules/meta.html",en:"http://weex-project.io/references/modules/meta.html"},examples:[{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:"setViewport",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"WebSocket",name:"WebSocket",title:{zh:"WebSocket
 模块",en:"WebSocket"},desc:{zh:"WebSockets 是一种先进的技术, 
这使得在用户的 H5/iOS/Android 
和一个服务器之间打开一个的交互式通信会话成为可能, 
有了这个 API，你可以向服务器发送消息, 
并接收事件驱动的响应, 无
需轮询服务器的响应。",en:"WebSockets is an advanced technology that 
makes it possible to open an intera
 ctive communication session between the user’s H5/iOS/android and a 
server."},docLink:{zh:"http://weex-project.io/cn/references/modules/websocket.html",en:"http://weex-project.io/references/modules/websocket.html"},examples:[{hash:"c4994c025226953c038b43da8b45124e",title:{zh:"使用范例",en:"Use
 
WebSocket"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]}]}},function(e,t){e.exports={type:"component",name:{zh:"组件",en:"Component"},group:[{type:"div",name:"div",title:{zh:"<div>
 组件",en:"<div>"},desc:{zh:"<div> 组件是用于包装å…
¶å®ƒç»„件的最基本容器。支持所有的通用样式、特性、flexbox 
布局。其类似于 HTML 的 <div> 容器，但不能直接在里面添加
文本（字符串），如果要展示文本，应该使用 <text> 
组件。",en:"<div> is the most fundamental component which is a contianer to 
wrap any other components. It supports all the common styles, attributes and 
layout of flexbox."},docLink:{en:"http
 
://weex-project.io/references/components/div.html",zh:"http://weex-project.io/cn/references/components/div.html"},examples:[{hash:"fb2522e71268aa8fb573eb20129ac4eb",title:{zh:"嵌套",en:"Nested"},screenshot:"https://gw.alicdn.com/tfs/TB1uKLGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"3488279c3502d1234b437c2f718f3a55",title:{zh:"重å
 
",en:"Overlap"},screenshot:"https://gw.alicdn.com/tfs/TB1FPAzd3MPMeJjy1XdXXasrXXa-540-844.png"},{hash:"7613db44f6c03a5849937fbbdeebf69d",title:{zh:"文字节点",en:"Text
 
Node"},screenshot:"https://gw.alicdn.com/tfs/TB1qlG2cwoQMeJjy1XaXXcSsFXa-540-844.png"}]},{type:"text",name:"text",title:{zh:";<text>
 组件",en:"<text>"},desc:{zh:"<text> 是 Weex 内
置的组件，用来将文本按照指定的样式渲染出来。<text> 
只能包含文本值，不支持子组件，你可以使用 {{}} 标记插å…
¥å˜é‡å€¼ä½œä¸ºæ–‡æœ¬å†…容。",en:"The weex builtin component ‘text’ is 
used to render text with specified style rule. tag can contain text value only. 
Y
 ou can use variable interpolation in the text content with the mark 
{{}}."},docLink:{zh:"http://weex-project.io/cn/references/components/text.html",en:"http://weex-project.io/references/components/text.html"},examples:[{hash:{zh:"3e0220d7b379955a26039131f153a360",en:"a718b029a7ba9cea08e84a6c22ec9bc4"},title:{zh:"最简例子",en:"Sample"},screenshot:{zh:"https://gw.alicdn.com/tfs/TB1V5IXcMMPMeJjy1XdXXasrXXa-540-844.png",en:"https://gw.alicdn.com/tfs/TB19gKsb8fH8KJjy1XbXXbLdXXa-540-844.png"}},{hash:"25b96fb0283300df1b183d019d835e4f",title:{zh:"lines
 
属性",en:'"lines"'},screenshot:"https://gw.alicdn.com/tfs/TB19JaYcMoQMeJjy0FpXXcTxpXa-540-844.png"},{scope:"website",hash:"7e123f72106c5dbba7675f6ee3bd35d2",title:{zh:"保留首尾空æ
 ¼",en:"Trim 
space"},screenshot:"https://gw.alicdn.com/tfs/TB140aYcMoQMeJjy0FpXXcTxpXa-540-844.png"},{hash:"161cd0771fd95f9e73c7663d4674c4f4",title:{zh:"实体字符",en:"Entity
 character"},screenshot:"https://gw.alicdn.com/tfs/TB1c41UcMoQMeJjy1XaXXcSsFXa-
 540-844.png"}]},{type:"image",name:"image",title:{zh:"<image> 
组件",en:"<image>"},desc:{zh:"<image> 
组件用于渲染图片，并且它不能包
含任何子组件。需要注意的是，必须明确指定 width 和 
height，否则图片无法显示。",en:"image tag is used to render a 
specified picture, and it shouldn’t contain any child component. <img> is not 
supported 
currently."},docLink:{zh:"http://weex-project.io/cn/references/components/image.html",en:"http://weex-project.io/references/components/image.html"},examples:[{hash:"e9cda6ca9ec05f2ff1852be82fc8f91f",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB12KPGbS_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"5bac698a83ca8c0467426746be011252",title:{zh:"resize
 属性",en:'"resize" 
Attribute'},screenshot:"https://gw.alicdn.com/tfs/TB1wKHLbILJ8KJjy0FnXXcFDpXa-540-844.png"},{hash:"97d978c234dffe96f594c7c10e9119d0",title:{zh:"浮层文字",en:"Layers"},screenshot:"https://gw.alicdn.com/tfs/TB1Mx1UcMoQ
 
MeJjy1XaXXcSsFXa-540-844.png"},{hash:"233e47ac9f3dc4cacb8e8f3e29646429",title:{zh:"图片实é™
…大小",en:"Original 
Size"},screenshot:"https://gw.alicdn.com/tfs/TB1sAh1gMMPMeJjy1XbXXcwxVXa-540-844.png"},{hash:"571231d08dee12a8feaa76d1109fbcdc",title:{zh:"Gif
 图片",en:"Gif 
Image"},screenshot:"https://gw.alicdn.com/tfs/TB1cbYxdwMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"3ad81eb6b0a66f4d2fa4a35ff8a310f5",title:{zh:"Base64
 图片",en:"Base64 
Image"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"list",name:"list",title:{zh:";<list>
 组件",en:"<list>"},desc:{zh:"<list> 组件是提供垂直列表功能的æ 
¸å¿ƒç»„件，拥有平滑的滚动和高效的内
存管理，非常适合用于长列表的展示。最简单的使用方法是在
 <list> 标签内使用数组循环生成的多个 <cell> 标签。",en:"The 
List component, which inherits from Scroller component, is a core component, 
and it provides the most popular features for using a list of 
 
items."},docLink:{zh:"http://weex-project.io/cn/references/components/list.html",en:"http://weex-project.io/references/components/list.html"},examples:[{hash:"3faed12fc18c947255abfa8354570170",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1pgDZcMoQMeJjy1XaXXcSsFXa-540-844.png"},{hash:"56f59761b7217e0f126f1de99a21a239",title:";<header>",screenshot:"https://gw.alicdn.com/tfs/TB1N_zLdxrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:";<loading>",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:";<refresh>",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"f4e660c403c0fd5140ac2747f498d948",title:{zh:"loadmore
 事件",en:'"loadmore" 
Event'},screenshot:"https://gw.alicdn.com/tfs/TB1tK66cMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"c7f682768e18b83bfca7f1327dfab9cd",title:{zh:"appear
 事件",en:'"appear" Event'},screenshot
 
:"https://gw.alicdn.com/tfs/TB1MnzLdxrI8KJjy0FpXXb5hVXa-540-844.png"}]},{type:"scroller",name:"scroller",title:{zh:";<scroller>
 组件",en:"<scroller>"},desc:{zh:"<scroller> 
是一个竖直的，可以容纳多个排成一列的子组件的滚动器。如果子组件的总高度高于å
…¶æœ¬èº«ï¼Œé‚£ä¹ˆæ‰€æœ‰çš„子组件都可滚动。",en:"A scroller is a 
component in vertical direction which can have multiple child components in one 
column. If total height of its child components exceed the height of the 
scroller, the whole child components will be 
scrollable."},docLink:{zh:"http://weex-project.io/cn/references/components/scroller.html",en:"http://weex-project.io/references/components/scroller.html"},examples:[{hash:"586ca3414132895999430f6e44d81419",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1tK66cMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"c626a5fb4981e8e8bce92d7b012c26b4",title:{zh:"水平滚动",en:"Horizontal
 Scroll"},screenshot:"https://gw.alicd
 
n.com/tfs/TB1QkqGb2DH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:"<loading>",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:";<refresh>",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"eb1f5edea6cb8f4fea06d67dc071eff7",title:{zh:"loadmore
 事件",en:'"loadmore" 
Event'},screenshot:"https://gw.alicdn.com/tfs/TB1tK66cMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"7e17173fb09cd29f3daa3a87739df60d",title:{zh:"appear
 事件",en:'"appear" 
Event'},screenshot:"https://gw.alicdn.com/tfs/TB1MnzLdxrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"14df0c05474fd16d4690e22194a69599",title:"scrollTo",screenshot:"https://gw.alicdn.com/tfs/TB1ZIPecwoQMeJjy0FoXXcShVXa-540-844.png"}]},{type:"slider",name:"slider",title:{zh:";<slider>
 组件",en:"<slider>"},desc:{zh:"<slider> 
组件用于在一个页面中展示多个图片，在前端，这种效果被称为
 轮播图ã€
 ‚",en:"A slide’s player to show slides (mostly as pictures) one page by 
another. The default interval between two slides is 3 
seconds."},docLink:{zh:"http://weex-project.io/cn/references/components/slider.html",en:"http://weex-project.io/references/components/slider.html"},examples:[{hash:"091cd18fe9cc00550b956f0fe3d7259b",title:{zh:"最简例子",en:"Simple"},screenshot:"https://gw.alicdn.com/tfs/TB1aIH3hiqAXuNjy1XdXXaYcVXa-540-844.png"},{hash:"cbe5742a1b9e0dc7586b0102b658b42b",title:{zh:"自动播放",en:"Auto
 
Play"},screenshot:"https://gw.alicdn.com/tfs/TB1ecL3hiqAXuNjy1XdXXaYcVXa-540-844.png"},{hash:"d835d18c6d411299f3aa8c68011d6748",title:{zh:";<indicator>",en:"With
 
Indicator"},screenshot:"https://gw.alicdn.com/tfs/TB1sdb3hiqAXuNjy1XdXXaYcVXa-540-844.png"},{hash:"a68f08ca82e2cc52126f3a02dbb1ac3e",title:{zh:"间隔时间",en:"Interval"},screenshot:"https://gw.alicdn.com/tfs/TB1XJj3hiqAXuNjy1XdXXaYcVXa-540-844.png"},{hash:"2d8da136e33f63a0bfe4b1e42362405b",title:";<slider-neighbo
 
r>",screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"input",name:"input",title:{zh:";<input>
 组件",en:"<input>"},desc:{zh:"Weex 内置的 <input> 
组件用来创建接收用户输入字符的输入组件。 <input> 
组件的工作方式因 type 属性的值而异，比如 text, password, url, 
email, tel 等。此组件不支持子组件和 click 事件。",en:"The weex 
builtin component input is used to create input controls to receive the 
user’s input 
characters."},docLink:{zh:"http://weex-project.io/cn/references/components/input.html",en:"http://weex-project.io/references/components/input.html"},examples:[{hash:"9ff5e5ded4969d19f76e028bf1440309",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1IQ9cdgMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"185e8574389d3242a79090414c336e4d",title:"Placeholder",screenshot:"https://gw.alicdn.com/tfs/TB1XPmcdgoQMeJjy0FoXXcShVXa-540-844.png"},{hash:"aab3e1a3835c9cdbed53fb127738507
 f",title:{zh:"初始状态",en:"Initial 
State"},screenshot:"https://gw.alicdn.com/tfs/TB1rnh_diERMeJjy0FcXXc7opXa-540-844.png"},{hash:"75492bb1c1af2b44293ce11164c0b3ba",title:{zh:"输å
…¥æ¡†ç±»åž‹",en:"Input 
Type"},screenshot:"https://gw.alicdn.com/tfs/TB1qDh_diERMeJjy0FcXXc7opXa-540-844.png"},{hash:"38cfc531ae3c0a10ac10236cd869e9eb",title:{zh:"事件处理",en:"Handle
 
Events"},screenshot:"https://gw.alicdn.com/tfs/TB1IQ9cdgMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"textarea",name:"textarea",title:{zh:";<textarea>
 组件",en:"<textarea>"},desc:{zh:"textarea 是 Weex 内
置的一个组件，用于用户交互，接受用户输å…
¥æ•°æ®ã€‚可以认为是允许多行的 <input> 组件。",en:"The weex 
builtin component textarea is used to create interactive controls to accept 
data from users. It can be a multi-line 
input."},docLink:{zh:"http://weex-project.io/cn/references/components/textarea.html",en:"http://weex-project.io/references/components/textarea.html"},examples:[{hash:"126de8266
 
778ddc7e967ef4cf1c98dec",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1TSyddgoQMeJjy0FoXXcShVXa-540-844.png"},{hash:"03caa359a9c4bf9fdc8a1d343f7f7a69",title:{zh:"默认行数",en:'Default
 
"rows"'},screenshot:"https://gw.alicdn.com/tfs/TB1AsF1diERMeJjSspjXXcpOXXa-540-844.png"}]},{type:"switch",name:"switch",title:{zh:";<switch>
 组件",en:"<switch>"},desc:{zh:"<switch> 是 Weex 的内
置组件，用来创建与 iOS 一致样式的按钮。例如在 iPhone 
中的设置应用中的飞行模式按钮就是一个 switch 
按钮。",en:"The weex builtin component switch is used to create and manage 
an IOS styled On/Off buttons, for example, the Airplane mode button in the 
Settings app is a switch 
button."},docLink:{zh:"http://weex-project.io/cn/references/components/switch.html",en:"http://weex-project.io/references/components/switch.html"},examples:[{hash:"d6769c27e18ab999ced059fff760ba0e",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.
 
com/tfs/TB1p7eDdGagSKJjy0FhXXcrbFXa-540-843.jpg"},{hash:"8a049fb7ff19c0ee9316a483b235dd26",title:{zh:"初始状态",en:"Initial
 
State"},screenshot:"https://gw.alicdn.com/tfs/TB1u0HRc2NNTKJjSspkXXaeWFXa-540-844.jpg"},{hash:"b48549c39f2e82178ce8b94b395d1d0b",title:{zh:"事件处理",en:"Handle
 
Events"},screenshot:"https://gw.alicdn.com/tfs/TB14HWzdGagSKJjy0FbXXa.mVXa-540-844.jpg"}]},{type:"video",name:"video",title:{zh:";<video>
 组件",en:"<video>"},desc:{zh:"<video> 组件可以让我们在 Weex 
页面中嵌入视频内容。<text> 是唯一合法的子组件。",en:"The 
video component can be used to embed video content in a weex 
page."},docLink:{zh:"http://weex-project.io/cn/references/components/video.html",en:"http://weex-project.io/references/components/video.html"},examples:[{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:
 {zh:"播放控制",en:"Play 
Control"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"事件处理",en:"Handle
 
Events"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"web",name:"web",title:{zh:";<web>
 组件",en:"<web>"},desc:{zh:"使用 <web> 组件在 Weex 页面中嵌入一张
网页内容。src 属性用来指定资源地址。你也可以使用 webview 
module 来控制 web 的行为，比如前进、后退和重载。",en:"Use web 
component to display any web content in the weex page. The src attribute is 
used to specify a special source. You also can use webview module to control 
some web operation such as goBack,goForward and 
reload."},docLink:{zh:"http://weex-project.io/cn/references/components/web.html",en:"http://weex-project.io/references/components/web.html"},examples:[{hash:"4e64eeb667e3d3959c310eb1e66d3105",title:{zh:"最简例子",en:"Sample"},sc
 
reenshot:"https://gw.alicdn.com/tfs/TB1LpGHdgMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"页面跳转",en:"Jump"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"ä¼
 é€’参数",en:"Pass 
Params"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"事件处理",en:"Handle
 
Events"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"richtext",name:"richtext",scope:"website",title:{zh:"富文本组件",en:";<richtext>"},desc:{zh:"",en:""},examples:[{hash:"36a1999a7957de7bcbeb7cca95ba46d2",title:{zh:"图文混排",en:"Use
 
richtext"},screenshot:"https://gw.alicdn.com/tfs/TB1VPOPcMMPMeJjy1XdXXasrXXa-540-844.png"},{hash:"8e3c274f5cae4a391a14ac81c890325f",title:{zh:"å†
…容输入",en:"With 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1SzOPcMMPMeJjy1Xd
 
XXasrXXa-540-844.png"}]},{type:"waterfall",name:"waterfall",title:{zh:"瀑布流组件",en:"<waterfall>"},desc:{zh:"提供瀑布流布局的组件。",en:"A
 component providing waterfall 
layout."},docLink:{zh:"http://weex-project.io/cn/references/components/waterfall.html",en:"http://weex-project.io/references/components/waterfall.html"},examples:[{hash:"4624d605004fc7eb9f14ca9c5a226fe3",title:{zh:"最简例子",en:"Sample"},screenshot:"https://gw.alicdn.com/tfs/TB1sF_CcMMPMeJjy1XcXXXpppXa-540-844.png"}]},{type:"recycle-list",name:"recycle-list",title:{zh:";<recycle-list>
 组件",en:"<recycle-list>"},desc:{zh:"<recycle-list> 
是一个新的列表容器，具有回收和复用的能力，可以大幅
优化内存占用和渲染性能。（仅在 >= 0.18.0 
的版本中支持）",en:"The <recycle-list> is a new list container with the 
ability to recycle and reuse the component template. It can greatly optimize 
memory usage and rendering performance."},docLink:{zh:"http://weex-project.io/
 
cn/references/components/recycle-list.html",en:"http://weex-project.io/references/components/recycle-list.html"},examples:[{hash:"927b9bfb487a42b775f36d7243026839",title:{zh:"文本绑定",en:"Text
 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1LeVoovDH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"56d434a1641b96df58c8f3d02d082f08",title:{zh:"属性绑定",en:"Attribute
 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1_pLKolfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"a633b3562355db1e38a2c5893664f5cb",title:{zh:"使用
 v-for",en:"Using 
v-for"},screenshot:"https://gw.alicdn.com/tfs/TB1oxNRor_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"546e29abce30c86205c69dbda8671013",title:{zh:"多层循环",en:"Multiple
 
v-for"},screenshot:"https://gw.alicdn.com/tfs/TB1W4JRor_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"836e767308c33a5d456b7ff51154c515",title:{zh:"条件渲染",en:"v-if/v-else"},screenshot:"https://gw.alicdn.com/tfs/TB1bsM4ohrI8KJjy0FpXXb5hVXa-540-844.png"},{hash:"5337dfdbe278c45b407ee2913d0eedd9",tit
 le:{zh:"绑定事件",en:"Event 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB1BjcCom_I8KJjy0FoXXaFnVXa-540-844.png"},{hash:"a38633d93a78c9ca98264e60b59ddd7d",title:{zh:"一次性渲染",en:"Using
 
v-once"},screenshot:"https://gw.alicdn.com/tfs/TB1AxNRor_I8KJjy1XaXXbsxpXa-540-844.png"},{hash:"1447937c097aedf64e7f746615069fe9",title:{zh:"绑定æ
 ·å¼",en:"Style 
Binding"},screenshot:"https://gw.alicdn.com/tfs/TB14K04oTnI8KJjy0FfXXcdoVXa-540-844.png"},{hash:"f2f74da321f900d3c52612a75a06d0de",title:{zh:"loadmore
 事件",en:'"loadmore" 
Event'},screenshot:"https://gw.alicdn.com/tfs/TB1tK66cMMPMeJjy1XcXXXpppXa-540-844.png"},{hash:"79b892c91b3b0a6f18c73654f95a4e7a",title:{zh:"æ—
 é™åˆ—表",en:"Infinite 
Scroll"},screenshot:"https://gw.alicdn.com/tfs/TB1JGrQilfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"05f153c3a2478605a66011e981964373",title:{zh:"水平滚动",en:"Horizontal
 
Scroll"},screenshot:"https://img.alicdn.com/tfs/TB1IoEFxGmWBuNjy1XaXXXCbXXa-540-844.png"}]},{type:"recycle-list-componen
 t",name:"recycle-list-component",title:{zh:"在 <recycle-list> 
中使用子组件",en:"<recycle-list> with 
components"},examples:[{hash:"4bb36641cf23c3a11b085a2ace33c369",title:{zh:"静态子组件",en:"Static
 
Component"},screenshot:"https://gw.alicdn.com/tfs/TB101VoovDH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"bd6b43a0e78347766b5cbc87b3ffb47e",title:{zh:"属性更新",en:"Update
 
Props"},screenshot:"https://gw.alicdn.com/tfs/TB1LeVoovDH8KJjy1XcXXcpdXXa-540-844.png"},{hash:"66a80b9dab170990ae7a07d1d265f5bc",title:{zh:"含å†
…部状态",en:"Stateful 
Component"},screenshot:"https://gw.alicdn.com/tfs/TB1tXHKolfH8KJjy1XbXXbLdXXa-540-844.png"},{hash:"1d88de057476c1d1d7ac923337385416",title:{zh:"移除组件",en:"Remove
 
Cell"},screenshot:"https://gw.alicdn.com/tfs/TB1j5d_XVGWBuNjy0FbXXb4sXXa-540-844.png"},{hash:"3639df8581e885b5ddd5f6e06041297d",title:"watch
 & 
computed",screenshot:"https://gw.alicdn.com/tfs/TB1X10oovDH8KJjy1XcXXcpdXXa-540-844.png"}]}]}}]);
\ No newline at end of file

Reply via email to