blob: e7eafe1cfa776719e248c8e2151d205af8404f72 [file] [log] [blame]
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Weex Variable | WEEX</title>
<meta name="description" content="Weex">
<link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png">
<script src="//g.alicdn.com/alilog/mlog/aplus_v2.js"></script>
<meta name="data-spm" dataSpmProtocol="i" content="a2c7j">
<meta name="aplus-ajax" content="chksum">
<meta name="aplus-waiting" content="MAN">
<meta name="google-site-verification" content="FbH8DPHpxdDJlfkKLKXuXWOu69DI8ZRRP8O2Phg8UKw">
<meta name="baidu-site-verification" content="WRr1iWvsYK">
<link rel="preload" href="/assets/css/styles.0ff943f0.css" as="style"><link rel="preload" href="/assets/js/app.0ff943f0.js" as="script"><link rel="preload" href="/assets/js/47.367f9103.js" as="script"><link rel="prefetch" href="/assets/css/1.styles.aa72e838.css"><link rel="prefetch" href="/assets/css/10.styles.1fff5b86.css"><link rel="prefetch" href="/assets/css/11.styles.a03faa50.css"><link rel="prefetch" href="/assets/css/2.styles.fc5d9892.css"><link rel="prefetch" href="/assets/css/21.styles.9ebad2b1.css"><link rel="prefetch" href="/assets/css/3.styles.6b94323a.css"><link rel="prefetch" href="/assets/css/36.styles.6dbb9d8c.css"><link rel="prefetch" href="/assets/css/4.styles.706a5607.css"><link rel="prefetch" href="/assets/css/7.styles.469d3b64.css"><link rel="prefetch" href="/assets/css/8.styles.b36167bf.css"><link rel="prefetch" href="/assets/css/9.styles.5bed6ebe.css"><link rel="prefetch" href="/assets/js/10.1fff5b86.js"><link rel="prefetch" href="/assets/js/100.09076a87.js"><link rel="prefetch" href="/assets/js/101.71fa3538.js"><link rel="prefetch" href="/assets/js/102.8a9926d6.js"><link rel="prefetch" href="/assets/js/103.d6c3649e.js"><link rel="prefetch" href="/assets/js/104.adb2425b.js"><link rel="prefetch" href="/assets/js/105.a063ca34.js"><link rel="prefetch" href="/assets/js/106.620e227f.js"><link rel="prefetch" href="/assets/js/107.1c97d156.js"><link rel="prefetch" href="/assets/js/108.d1f236a9.js"><link rel="prefetch" href="/assets/js/109.10a909cc.js"><link rel="prefetch" href="/assets/js/11.a03faa50.js"><link rel="prefetch" href="/assets/js/110.6f9200c8.js"><link rel="prefetch" href="/assets/js/111.9c1831b3.js"><link rel="prefetch" href="/assets/js/112.e5c0d546.js"><link rel="prefetch" href="/assets/js/113.b1c17feb.js"><link rel="prefetch" href="/assets/js/114.c24b95ed.js"><link rel="prefetch" href="/assets/js/115.d7e38c3b.js"><link rel="prefetch" href="/assets/js/116.1aaa95ab.js"><link rel="prefetch" href="/assets/js/117.1a9e5539.js"><link rel="prefetch" href="/assets/js/118.8d915477.js"><link rel="prefetch" href="/assets/js/119.77f0a126.js"><link rel="prefetch" href="/assets/js/12.16a9b730.js"><link rel="prefetch" href="/assets/js/120.3cf0ba10.js"><link rel="prefetch" href="/assets/js/121.47fefbf1.js"><link rel="prefetch" href="/assets/js/122.3dd022e8.js"><link rel="prefetch" href="/assets/js/123.84abc63f.js"><link rel="prefetch" href="/assets/js/124.2568e233.js"><link rel="prefetch" href="/assets/js/125.5b665f24.js"><link rel="prefetch" href="/assets/js/126.25b58a0a.js"><link rel="prefetch" href="/assets/js/127.d62a58c6.js"><link rel="prefetch" href="/assets/js/128.e5774a02.js"><link rel="prefetch" href="/assets/js/129.9a813c06.js"><link rel="prefetch" href="/assets/js/13.f8bde866.js"><link rel="prefetch" href="/assets/js/130.edddc316.js"><link rel="prefetch" href="/assets/js/131.760aa65c.js"><link rel="prefetch" href="/assets/js/132.559d5ba7.js"><link rel="prefetch" href="/assets/js/133.cbdd35c7.js"><link rel="prefetch" href="/assets/js/134.c02d92e1.js"><link rel="prefetch" href="/assets/js/135.e6d5496a.js"><link rel="prefetch" href="/assets/js/136.8826af60.js"><link rel="prefetch" href="/assets/js/137.28b4573d.js"><link rel="prefetch" href="/assets/js/138.d370fc15.js"><link rel="prefetch" href="/assets/js/139.8d9150fc.js"><link rel="prefetch" href="/assets/js/14.a98602cc.js"><link rel="prefetch" href="/assets/js/140.f0a9b5e1.js"><link rel="prefetch" href="/assets/js/141.297fa6fe.js"><link rel="prefetch" href="/assets/js/142.82bbcbaa.js"><link rel="prefetch" href="/assets/js/143.2d1ed3b2.js"><link rel="prefetch" href="/assets/js/144.69a9bc6a.js"><link rel="prefetch" href="/assets/js/145.74d52c12.js"><link rel="prefetch" href="/assets/js/146.12ecdaf4.js"><link rel="prefetch" href="/assets/js/147.daad4b96.js"><link rel="prefetch" href="/assets/js/148.bb356182.js"><link rel="prefetch" href="/assets/js/149.56fdaace.js"><link rel="prefetch" href="/assets/js/15.ea6e5024.js"><link rel="prefetch" href="/assets/js/150.ee9c4994.js"><link rel="prefetch" href="/assets/js/151.2feae618.js"><link rel="prefetch" href="/assets/js/152.c7703521.js"><link rel="prefetch" href="/assets/js/153.3b555eab.js"><link rel="prefetch" href="/assets/js/154.c6329253.js"><link rel="prefetch" href="/assets/js/155.334c4ea4.js"><link rel="prefetch" href="/assets/js/156.1a29657f.js"><link rel="prefetch" href="/assets/js/157.ba8f07bc.js"><link rel="prefetch" href="/assets/js/158.a60a60ba.js"><link rel="prefetch" href="/assets/js/159.9ce96d49.js"><link rel="prefetch" href="/assets/js/16.14acc638.js"><link rel="prefetch" href="/assets/js/160.2a970224.js"><link rel="prefetch" href="/assets/js/161.a26e2b53.js"><link rel="prefetch" href="/assets/js/162.73535662.js"><link rel="prefetch" href="/assets/js/163.7518a0a5.js"><link rel="prefetch" href="/assets/js/164.17367778.js"><link rel="prefetch" href="/assets/js/165.46c8f055.js"><link rel="prefetch" href="/assets/js/166.1cc22037.js"><link rel="prefetch" href="/assets/js/167.3fbcb5c6.js"><link rel="prefetch" href="/assets/js/168.a3f80f1e.js"><link rel="prefetch" href="/assets/js/169.a6565c29.js"><link rel="prefetch" href="/assets/js/17.d6f2f3b8.js"><link rel="prefetch" href="/assets/js/170.566ddeda.js"><link rel="prefetch" href="/assets/js/171.4fd97bee.js"><link rel="prefetch" href="/assets/js/172.5295c6b9.js"><link rel="prefetch" href="/assets/js/173.ff25fd05.js"><link rel="prefetch" href="/assets/js/174.22ea6a1b.js"><link rel="prefetch" href="/assets/js/175.c6a04367.js"><link rel="prefetch" href="/assets/js/176.d3810924.js"><link rel="prefetch" href="/assets/js/177.facd2802.js"><link rel="prefetch" href="/assets/js/178.f4c6fbe9.js"><link rel="prefetch" href="/assets/js/179.1a3a2c12.js"><link rel="prefetch" href="/assets/js/18.83f6b39a.js"><link rel="prefetch" href="/assets/js/180.b54c8e90.js"><link rel="prefetch" href="/assets/js/181.88495b4c.js"><link rel="prefetch" href="/assets/js/182.8341d23c.js"><link rel="prefetch" href="/assets/js/183.332bcfe2.js"><link rel="prefetch" href="/assets/js/184.d8996a56.js"><link rel="prefetch" href="/assets/js/185.b8584f07.js"><link rel="prefetch" href="/assets/js/186.fa89e23f.js"><link rel="prefetch" href="/assets/js/187.90340eeb.js"><link rel="prefetch" href="/assets/js/188.efe631f8.js"><link rel="prefetch" href="/assets/js/189.72897b1a.js"><link rel="prefetch" href="/assets/js/19.94f071c0.js"><link rel="prefetch" href="/assets/js/190.1ec691ee.js"><link rel="prefetch" href="/assets/js/2.fc5d9892.js"><link rel="prefetch" href="/assets/js/20.13f7bbff.js"><link rel="prefetch" href="/assets/js/21.9ebad2b1.js"><link rel="prefetch" href="/assets/js/22.764b643d.js"><link rel="prefetch" href="/assets/js/23.f533737e.js"><link rel="prefetch" href="/assets/js/24.4eaa533c.js"><link rel="prefetch" href="/assets/js/25.e9877e57.js"><link rel="prefetch" href="/assets/js/26.8905d6a0.js"><link rel="prefetch" href="/assets/js/27.b199a955.js"><link rel="prefetch" href="/assets/js/28.524af0cf.js"><link rel="prefetch" href="/assets/js/29.b772949f.js"><link rel="prefetch" href="/assets/js/3.6b94323a.js"><link rel="prefetch" href="/assets/js/30.f5bcac64.js"><link rel="prefetch" href="/assets/js/31.c55e03aa.js"><link rel="prefetch" href="/assets/js/32.e575600a.js"><link rel="prefetch" href="/assets/js/33.3fff5656.js"><link rel="prefetch" href="/assets/js/34.82598567.js"><link rel="prefetch" href="/assets/js/35.8e1290ba.js"><link rel="prefetch" href="/assets/js/36.6dbb9d8c.js"><link rel="prefetch" href="/assets/js/37.d27fdc88.js"><link rel="prefetch" href="/assets/js/38.f8fc7b20.js"><link rel="prefetch" href="/assets/js/39.bf967d40.js"><link rel="prefetch" href="/assets/js/4.706a5607.js"><link rel="prefetch" href="/assets/js/40.e1864fd6.js"><link rel="prefetch" href="/assets/js/41.61bd3b64.js"><link rel="prefetch" href="/assets/js/42.34d8d61d.js"><link rel="prefetch" href="/assets/js/43.1aee493f.js"><link rel="prefetch" href="/assets/js/44.22177e9b.js"><link rel="prefetch" href="/assets/js/45.5c743d2f.js"><link rel="prefetch" href="/assets/js/46.4feffac9.js"><link rel="prefetch" href="/assets/js/48.0c246d45.js"><link rel="prefetch" href="/assets/js/49.ee354be9.js"><link rel="prefetch" href="/assets/js/5.7d9779f7.js"><link rel="prefetch" href="/assets/js/50.bd81c7f0.js"><link rel="prefetch" href="/assets/js/51.a5f432dd.js"><link rel="prefetch" href="/assets/js/52.537aded4.js"><link rel="prefetch" href="/assets/js/53.84814584.js"><link rel="prefetch" href="/assets/js/54.5f780e97.js"><link rel="prefetch" href="/assets/js/55.9d44c91d.js"><link rel="prefetch" href="/assets/js/56.fc164b43.js"><link rel="prefetch" href="/assets/js/57.959b2d44.js"><link rel="prefetch" href="/assets/js/58.bd5c38e0.js"><link rel="prefetch" href="/assets/js/59.3eaece52.js"><link rel="prefetch" href="/assets/js/6.49a49457.js"><link rel="prefetch" href="/assets/js/60.4b8cb735.js"><link rel="prefetch" href="/assets/js/61.b54b9195.js"><link rel="prefetch" href="/assets/js/62.0116614c.js"><link rel="prefetch" href="/assets/js/63.85b1247d.js"><link rel="prefetch" href="/assets/js/64.8f1be6b5.js"><link rel="prefetch" href="/assets/js/65.6a241647.js"><link rel="prefetch" href="/assets/js/66.08c8bd13.js"><link rel="prefetch" href="/assets/js/67.002e0071.js"><link rel="prefetch" href="/assets/js/68.6c6a7c94.js"><link rel="prefetch" href="/assets/js/69.64d90e5d.js"><link rel="prefetch" href="/assets/js/7.469d3b64.js"><link rel="prefetch" href="/assets/js/70.b2c287c9.js"><link rel="prefetch" href="/assets/js/71.b7ad1135.js"><link rel="prefetch" href="/assets/js/72.7391b5c2.js"><link rel="prefetch" href="/assets/js/73.c5c77d81.js"><link rel="prefetch" href="/assets/js/74.96f80ffd.js"><link rel="prefetch" href="/assets/js/75.2920c7b7.js"><link rel="prefetch" href="/assets/js/76.a90bd3c9.js"><link rel="prefetch" href="/assets/js/77.3a0eeccd.js"><link rel="prefetch" href="/assets/js/78.6791678c.js"><link rel="prefetch" href="/assets/js/79.8b0c78e4.js"><link rel="prefetch" href="/assets/js/8.b36167bf.js"><link rel="prefetch" href="/assets/js/80.2641b89d.js"><link rel="prefetch" href="/assets/js/81.03d1925e.js"><link rel="prefetch" href="/assets/js/82.71061708.js"><link rel="prefetch" href="/assets/js/83.df220a8f.js"><link rel="prefetch" href="/assets/js/84.99fbef8f.js"><link rel="prefetch" href="/assets/js/85.dee8bcae.js"><link rel="prefetch" href="/assets/js/86.5200e4ce.js"><link rel="prefetch" href="/assets/js/87.96df0d82.js"><link rel="prefetch" href="/assets/js/88.e9171a32.js"><link rel="prefetch" href="/assets/js/89.53987bbc.js"><link rel="prefetch" href="/assets/js/9.5bed6ebe.js"><link rel="prefetch" href="/assets/js/90.8da0ff06.js"><link rel="prefetch" href="/assets/js/91.4bcce2cd.js"><link rel="prefetch" href="/assets/js/92.aca18707.js"><link rel="prefetch" href="/assets/js/93.93fdf568.js"><link rel="prefetch" href="/assets/js/94.e893b256.js"><link rel="prefetch" href="/assets/js/95.cb1d62b6.js"><link rel="prefetch" href="/assets/js/96.5529545c.js"><link rel="prefetch" href="/assets/js/97.d01eda68.js"><link rel="prefetch" href="/assets/js/98.384bebd6.js"><link rel="prefetch" href="/assets/js/99.fa349b8f.js"><link rel="prefetch" href="/assets/js/vendors~docsearch.aa72e838.js">
<link rel="stylesheet" href="/assets/css/styles.0ff943f0.css">
</head>
<body>
<div id="app" data-server-rendered="true"><div class="theme-container vuepress-theme-fast"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div><a href="/" class="home-link router-link-active"><img src="/logo@2x.svg" alt="WEEX" class="logo"></a><span class="version"><a href="/download/download.html" class="version-bg"><img src="/assets/img/version-bg.ab65ded9.svg" alt="v0.28"><span class="version-no">v0.28</span></a></span><div class="links"><form id="search-form" class="algolia-search-wrapper search-box"><input id="algolia-search-input" class="search-query"></form><nav class="nav-links can-hide"><div class="nav-item"><a href="/guide/" class="nav-link">Guide</a></div><div class="nav-item"><a href="/docs/" class="nav-link router-link-active">Docs</a></div><div class="nav-item"><a href="/tools/" class="nav-link">Third Party Tools</a></div><div class="nav-item"><a href="/download/" class="nav-link">Download</a></div><div class="nav-item"><a href="/community/" class="nav-link">Community</a></div><div class="nav-item"><a href="/blog/" class="nav-link">Blog</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/docs/api/weex-variable.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----><a href="/zh/docs/api/weex-variable.html" class="nav-link">简体中文</a></li></ul></div></div></nav><a href="https://github.com/apache/incubator-weex" target="_blank" rel="noopener noreferrer" class="repo-link"><img src="/assets/img/github.7cb484a9.svg" alt="github" class="github-icon"></a></div></header><div class="sidebar-mask"></div><div class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/guide/" class="nav-link">Guide</a></div><div class="nav-item"><a href="/docs/" class="nav-link router-link-active">Docs</a></div><div class="nav-item"><a href="/tools/" class="nav-link">Third Party Tools</a></div><div class="nav-item"><a href="/download/" class="nav-link">Download</a></div><div class="nav-item"><a href="/community/" class="nav-link">Community</a></div><div class="nav-item"><a href="/blog/" class="nav-link">Blog</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/docs/api/weex-variable.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----><a href="/zh/docs/api/weex-variable.html" class="nav-link">简体中文</a></li></ul></div></div></nav><ul class="sidebar-links"><li><div class="sidebar-group first"><p class="sidebar-heading open"><span>API</span><!----></p><ul class="sidebar-group-items"><li><a href="/docs/api/weex-variable.html" class="active sidebar-link">Weex Variable</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#properties-and-methods" class="sidebar-link">Properties and Methods</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#config" class="sidebar-link">config</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#document" class="sidebar-link">document</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#requiremodule" class="sidebar-link">requireModule</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#supports" class="sidebar-link">supports</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#isregisteredmodule" class="sidebar-link">isRegisteredModule</a></li><li class="sidebar-sub-header"><a href="/docs/api/weex-variable.html#isregisteredcomponent" class="sidebar-link">isRegisteredComponent</a></li></ul></li><li><a href="/docs/api/android-apis.html" class="sidebar-link">Android APIs</a></li><li><a href="/docs/api/ios-apis.html" class="sidebar-link">iOS APIs</a></li><li><a href="/docs/api/js-service.html" class="sidebar-link">JS Service</a></li><li><a href="/docs/api/broadcast-channel.html" class="sidebar-link">BroadcastChannel</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Built-in Components</span><!----></p><ul class="sidebar-group-items"><li><a href="/docs/components/a.html" class="sidebar-link">&lt;a&gt;</a></li><li><a href="/docs/components/div.html" class="sidebar-link">&lt;div&gt;</a></li><li><a href="/docs/components/text.html" class="sidebar-link">&lt;text&gt;</a></li><li><a href="/docs/components/image.html" class="sidebar-link">&lt;image&gt;</a></li><li><a href="/docs/components/list.html" class="sidebar-link">&lt;list&gt;</a></li><li><a href="/docs/components/cell.html" class="sidebar-link">&lt;cell&gt;</a></li><li><a href="/docs/components/loading.html" class="sidebar-link">&lt;loading&gt;</a></li><li><a href="/docs/components/refresh.html" class="sidebar-link">&lt;refresh&gt;</a></li><li><a href="/docs/components/recycle-list.html" class="sidebar-link">&lt;recycle-list&gt;</a></li><li><a href="/docs/components/scroller.html" class="sidebar-link">&lt;scroller&gt;</a></li><li><a href="/docs/components/slider.html" class="sidebar-link">&lt;slider&gt;</a></li><li><a href="/docs/components/indicator.html" class="sidebar-link">&lt;indicator&gt;</a></li><li><a href="/docs/components/textarea.html" class="sidebar-link">&lt;textarea&gt;</a></li><li><a href="/docs/components/input.html" class="sidebar-link">&lt;input&gt;</a></li><li><a href="/docs/components/waterfall.html" class="sidebar-link">&lt;waterfall&gt;</a></li><li><a href="/docs/components/video.html" class="sidebar-link">&lt;video&gt;</a></li><li><a href="/docs/components/web.html" class="sidebar-link">&lt;web&gt;</a></li><li><a href="/docs/components/richtext.html" class="sidebar-link">&lt;richtext&gt;</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Built-in Modules</span><!----></p><ul class="sidebar-group-items"><li><a href="/docs/modules/animation.html" class="sidebar-link">animation</a></li><li><a href="/docs/modules/clipboard.html" class="sidebar-link">clipboard</a></li><li><a href="/docs/modules/dom.html" class="sidebar-link">dom</a></li><li><a href="/docs/modules/globalEvent.html" class="sidebar-link">globalEvent</a></li><li><a href="/docs/modules/meta.html" class="sidebar-link">meta</a></li><li><a href="/docs/modules/modal.html" class="sidebar-link">modal</a></li><li><a href="/docs/modules/navigator.html" class="sidebar-link">navigator</a></li><li><a href="/docs/modules/picker.html" class="sidebar-link">picker</a></li><li><a href="/docs/modules/storage.html" class="sidebar-link">storage</a></li><li><a href="/docs/modules/stream.html" class="sidebar-link">stream</a></li><li><a href="/docs/modules/webview.html" class="sidebar-link">webview</a></li><li><a href="/docs/modules/websockets.html" class="sidebar-link">webSockets</a></li><li><a href="/docs/modules/deviceInfo.html" class="sidebar-link">deviceInfo</a></li><li><a href="/docs/modules/console-log.html" class="sidebar-link">console-log</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Styles</span><!----></p><ul class="sidebar-group-items"><li><a href="/docs/styles/common-styles.html" class="sidebar-link">Common Styles</a></li><li><a href="/docs/styles/text-styles.html" class="sidebar-link">Text Styles</a></li><li><a href="/docs/styles/css-units.html" class="sidebar-link">CSS Units</a></li><li><a href="/docs/styles/color-name.html" class="sidebar-link">Color name</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Events</span><!----></p><ul class="sidebar-group-items"><li><a href="/docs/events/common-events.html" class="sidebar-link">Common Events</a></li><li><a href="/docs/events/event-bubbling.html" class="sidebar-link">Event Bubble</a></li><li><a href="/docs/events/gesture.html" class="sidebar-link">Gesture</a></li></ul></div></li></ul></div><div class="page"><div class="content"><p>Every Weex page contains a <code>weex</code> variable in its js runtime context. It can be assessed directly just like a global object, but it is <em>readonly</em> and separated from different pages.</p><blockquote><p>NOTE: <strong>The <code>weex</code> variable only exposed in the Vue framework. It's not available in Rax framework yet.</strong></p></blockquote><h2 id="properties-and-methods"><a href="#properties-and-methods" class="header-anchor">#</a> Properties and Methods</h2><p>The type declaration of the Weex variable is:</p><div class="language-typescript extra-class"><pre class="language-typescript"><code><span class="token keyword">declare</span> <span class="token keyword">type</span> Weex <span class="token operator">=</span> <span class="token punctuation">{</span>
config<span class="token punctuation">:</span> WeexConfigAPI<span class="token punctuation">;</span>
document<span class="token punctuation">:</span> WeexDocument<span class="token punctuation">;</span>
<span class="token function-variable function">requireModule</span><span class="token punctuation">:</span> <span class="token punctuation">(</span><span class="token parameter">name<span class="token punctuation">:</span> <span class="token builtin">string</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> Object <span class="token operator">|</span> <span class="token keyword">void</span><span class="token punctuation">;</span>
<span class="token function-variable function">supports</span><span class="token punctuation">:</span> <span class="token punctuation">(</span><span class="token parameter">condition<span class="token punctuation">:</span> <span class="token builtin">string</span></span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token builtin">boolean</span> <span class="token operator">|</span> <span class="token keyword">void</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="config"><a href="#config" class="header-anchor">#</a><code>config</code></h2><p>The <code>weex.config</code> contains all the environment information of current page.</p><div class="language-typescript extra-class"><pre class="language-typescript"><code><span class="token keyword">declare</span> <span class="token keyword">type</span> WeexConfigAPI <span class="token operator">=</span> <span class="token punctuation">{</span>
bundleUrl<span class="token punctuation">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
bundleType<span class="token operator">?</span><span class="token punctuation">:</span> <span class="token builtin">string</span><span class="token punctuation">;</span>
env<span class="token punctuation">:</span> WeexEnvironment<span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre></div><ul><li><code>bundleUrl</code>: The URL of the js bundle in current page.</li><li><code>bundleType</code>: <span class="api-version">v0.17+</span> The type of the js bundle, it indicates which framework is using for current js bundle, could be <code>&quot;Vue&quot;</code> or <code>&quot;Rax&quot;</code>.</li><li><code>env</code>: Weex environment object.</li></ul><h3 id="weex-environment-object"><a href="#weex-environment-object" class="header-anchor">#</a> Weex Environment Object</h3><p>Sometimes, you still need to write some platform specific codes for compatibility or enhancement. Weex provides <code>weex.config.env</code> and a global object <code>WXEnvironment</code> (they are strictly equal) to get the information of current runtime environment.</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span>config<span class="token punctuation">.</span>env <span class="token operator">===</span> WXEnvironment
</code></pre></div><p><strong>Properties in Weex environment object</strong>:</p><table><thead><tr><th>Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td><code>platform</code></td><td>String</td><td>Current running platform, could be &quot;Android&quot;, &quot;iOS&quot; or &quot;Web&quot;.</td></tr><tr><td><code>weexVersion</code></td><td>String</td><td>The version of Weex SDK.</td></tr><tr><td><code>appName</code></td><td>String</td><td>Mobile app name or browser name.</td></tr><tr><td><code>appVersion</code></td><td>String</td><td>The version of current app.</td></tr><tr><td><code>osName</code></td><td>String</td><td>The OS name, could be &quot;Android&quot; or &quot;iOS&quot;.</td></tr><tr><td><code>osVersion</code></td><td>String</td><td>The version of current OS.</td></tr><tr><td><code>deviceModel</code></td><td>String</td><td>Mobile phone device model. (native only)</td></tr><tr><td><code>deviceWidth</code></td><td>Number</td><td>Screen resolution width.</td></tr><tr><td><code>deviceHeight</code></td><td>Number</td><td>Screen resolution height.</td></tr></tbody></table><p><a href="http://dotwe.org/vue/ea2cff9039f3b0e406f8f7da10e874af" target="_blank" rel="noopener noreferrer">This example<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a> prints all properties in the Weex environment object.</p><h2 id="document"><a href="#document" class="header-anchor">#</a><code>document</code></h2><p>The <code>weex.document</code> is the document object of current page, it can be used to create or manipulate the <em>Elements</em> in <em>DOM tree</em>. It's part of <em>Weex DOM API</em> specification which is NOT the same with the <code>document</code> object in the <a href="https://www.w3.org/DOM/" target="_blank" rel="noopener noreferrer">W3C DOM API<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a>.</p><p>However, it's not a good practice to manipulate DOM directly when using modern front-end frameworks, such as Vue and Rax. Especially, <strong>there is no actually DOM in Weex</strong>, it was simulated on the native (Android or iOS).</p><p>This API is mainly used inside of the Vue and Rax framework to convert the virtual-dom into render directives and send them to native render engines of Weex. Not recommended for using it when developing pages.</p><h2 id="requiremodule"><a href="#requiremodule" class="header-anchor">#</a><code>requireModule</code></h2><p>For those features which does not rely on the UI, Weex wraps them into <strong>modules</strong>. It is a way to access native capabilities in javascript. Except for the <a href="/docs/modules/animation.html">built-in modules</a>, it's quite easy to integrate the existing native modules to Weex platform. After that, you can use <code>weex.requireModule</code> to require both customized and built-in modules.</p><div class="language-typescript extra-class"><pre class="language-typescript"><code>weex<span class="token punctuation">.</span><span class="token function">requireModule</span><span class="token punctuation">(</span>name<span class="token punctuation">:</span> <span class="token builtin">string</span><span class="token punctuation">)</span><span class="token punctuation">:</span> Object <span class="token operator">|</span> <span class="token keyword">void</span><span class="token punctuation">;</span>
</code></pre></div><p><strong>Parameter:</strong></p><ul><li>A case-sensitive module name.</li></ul><p><strong>Return Value:</strong></p><ul><li>If the module is registered, return a <code>Proxy</code> or plain object if the context doesn't support <code>Proxy</code>. You can use it to call the registered methods in the module.</li><li>If the module is unregistered, return <code>undefined</code>.</li></ul><h3 id="use-native-module"><a href="#use-native-module" class="header-anchor">#</a> Use Native Module</h3><p>You can require a native module and use its APIs just like normal javascript functions. Here is <a href="http://dotwe.org/vue/cd7e97f7da08d6d4ca627fc127ab8828" target="_blank" rel="noopener noreferrer">a simple example<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a> of using the <code>modal</code> module:</p><div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>text</span><span class="token punctuation">&gt;</span></span>Toast<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>text</span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
<span class="token keyword">const</span> modal <span class="token operator">=</span> weex<span class="token punctuation">.</span><span class="token function">requireModule</span><span class="token punctuation">(</span><span class="token string">'modal'</span><span class="token punctuation">)</span>
modal<span class="token punctuation">.</span><span class="token function">toast</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
message<span class="token punctuation">:</span> <span class="token string">'I am a toast.'</span><span class="token punctuation">,</span>
duration<span class="token punctuation">:</span> <span class="token number">3</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre></div><h2 id="supports"><a href="#supports" class="header-anchor">#</a><code>supports</code></h2><blockquote><p>This API only available in <span class="api-version">v0.15+</span>.</p></blockquote><p>As you may know, components and modules are extendable and configurable in Weex. So it could be various in different apps or running context. You can use <code>weex.supports</code> to detect whether a feature is supported in the current environment at runtime.</p><div class="language-typescript extra-class"><pre class="language-typescript"><code>weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span>condition<span class="token punctuation">:</span> <span class="token builtin">string</span><span class="token punctuation">)</span><span class="token punctuation">:</span> <span class="token builtin">boolean</span> <span class="token operator">|</span> <span class="token keyword">void</span><span class="token punctuation">;</span>
</code></pre></div><p><strong>Parameter:</strong></p><ul><li>A formatted condition string: <code>@{type}/{name}</code>.</li></ul><p>The <code>type</code> must be <code>&quot;component&quot;</code> or <code>&quot;module&quot;</code>. The <code>name</code> could be a tag name, module name or the method name in specific module.</p><p><strong>Return Value:</strong></p><ul><li>If the feature is supported, return <code>true</code>.</li><li>If the feature is unsupported, return <code>false</code>.</li><li>If not sure about whether this feature is supported, return <code>null</code>.</li></ul><h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3><p>Detects whether the specific component is supported:</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@component/slider'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@component/my-tab'</span><span class="token punctuation">)</span> <span class="token comment">// false</span>
</code></pre></div><p>Detects whether the specific module is supported:</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@module/stream'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@module/abcdef'</span><span class="token punctuation">)</span> <span class="token comment">// false</span>
</code></pre></div><p>Detects whether the method in specific module is supported:</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@module/dom.getComponentRect'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@module/navigator.jumpToPage'</span><span class="token punctuation">)</span> <span class="token comment">// false</span>
</code></pre></div><p>Invalid input or unknown features:</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'div'</span><span class="token punctuation">)</span> <span class="token comment">// null</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'module/*'</span><span class="token punctuation">)</span> <span class="token comment">// null</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'@stream/fetch'</span><span class="token punctuation">)</span> <span class="token operator">/</span><span class="token operator">/</span> <span class="token keyword">null</span>
weex<span class="token punctuation">.</span><span class="token function">supports</span><span class="token punctuation">(</span><span class="token string">'getComponentRect'</span><span class="token punctuation">)</span> <span class="token operator">/</span><span class="token operator">/</span> <span class="token keyword">null</span>
</code></pre></div><h2 id="isregisteredmodule"><a href="#isregisteredmodule" class="header-anchor">#</a><code>isRegisteredModule</code></h2><p>Detect whether the specific module or method is registered.</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span>weex<span class="token punctuation">.</span><span class="token function">isRegisteredModule</span><span class="token punctuation">(</span>moduleName<span class="token punctuation">:</span> string<span class="token punctuation">,</span> methodName<span class="token punctuation">:</span> string<span class="token punctuation">)</span><span class="token punctuation">:</span> boolean
</code></pre></div><p>It can only be used to check compatibility of a specific module or method.</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">isRegisteredModule</span><span class="token punctuation">(</span><span class="token string">'stream'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">isRegisteredModule</span><span class="token punctuation">(</span><span class="token string">'stream'</span><span class="token punctuation">,</span> <span class="token string">'fetch'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">isRegisteredModule</span><span class="token punctuation">(</span><span class="token string">'whatever'</span><span class="token punctuation">,</span> <span class="token string">'- unknown -'</span><span class="token punctuation">)</span> <span class="token comment">// false</span>
weex<span class="token punctuation">.</span><span class="token function">isRegisteredModule</span><span class="token punctuation">(</span><span class="token string">'div'</span><span class="token punctuation">)</span> <span class="token comment">// false, not support components</span>
</code></pre></div><h2 id="isregisteredcomponent"><a href="#isregisteredcomponent" class="header-anchor">#</a><code>isRegisteredComponent</code></h2><p>Detect whether the specific component is registered.</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span>weex<span class="token punctuation">.</span><span class="token function">isRegisteredComponent</span><span class="token punctuation">(</span>componentName<span class="token punctuation">:</span> string<span class="token punctuation">)</span><span class="token punctuation">:</span> boolean
</code></pre></div><p>It can only be used to check compatibility of a specific component.</p><div class="language-js extra-class"><pre class="language-js"><code>weex<span class="token punctuation">.</span><span class="token function">isRegisteredComponent</span><span class="token punctuation">(</span><span class="token string">'div'</span><span class="token punctuation">)</span> <span class="token comment">// true</span>
weex<span class="token punctuation">.</span><span class="token function">isRegisteredComponent</span><span class="token punctuation">(</span><span class="token string">'- unknown -'</span><span class="token punctuation">)</span> <span class="token comment">// false</span>
weex<span class="token punctuation">.</span><span class="token function">isRegisteredComponent</span><span class="token punctuation">(</span><span class="token string">'navigator'</span><span class="token punctuation">)</span> <span class="token comment">// false, not support modules</span>
</code></pre></div></div><div class="page-nav"><p class="inner"><!----><span class="next"><a href="/docs/api/android-apis.html">
Android APIs
</a>
</span></p></div><div class="page-edit"><div class="last-updated"><span class="prefix">Last Updated: </span><span class="time">12/10/2020</span></div><div class="edit-link"><a href="https://github.com/apache/incubator-weex-site/edit/master/docs/docs/api/weex-variable.md" target="_blank" rel="noopener noreferrer">Edit this page</a><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><a href="https://github.com/apache/incubator-weex-site/issues/new?body=https%3A%2F%2Fweex.io%2F" target="_blank" rel="noopener noreferrer" class="issueText">Suggest</a><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></div><div class="score"><span class="choice"><img src="https://img.alicdn.com/tfs/TB1h7TSqpYqK1RjSZLeXXbXppXa-20-18.svg" class="score-icon">Excellent doc</span><span class="choice"><img src="https://img.alicdn.com/tfs/TB1h7TSqpYqK1RjSZLeXXbXppXa-20-18.svg" class="score-icon bad">Unusable doc</span></div></div><div class="license-wrap" style="display:none;"><footer class="footer-container" data-v-0ad13d84><div class="footer-body" data-v-0ad13d84><img src="/logo@2x.svg" class="logo" data-v-0ad13d84><img src="//img.alicdn.com/tfs/TB11BRiIW6qK1RjSZFmXXX0PFXa-365-365.png" class="apache" data-v-0ad13d84><div class="cols-container" data-v-0ad13d84><div class="col col-12" data-v-0ad13d84><h3 data-v-0ad13d84>Disclaimer</h3><p data-v-0ad13d84>Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the
Incubator. Incubation is required of all newly accepted projects until a further review indicates that the
infrastructure, communications, and decision making process have stabilized in a manner consistent with
other successful ASF projects. While incubation status is not necessarily a reflection of the completeness
or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>ASF</dt><dd data-v-0ad13d84><a href="http://www.apache.org" target="_self" data-v-0ad13d84>Foundation</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/licenses/" target="_self" data-v-0ad13d84>License</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/events/current-event" target="_self" data-v-0ad13d84>Events</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/foundation/sponsorship.html" target="_self" data-v-0ad13d84>Sponsorship</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/foundation/thanks.html" target="_self" data-v-0ad13d84>Thanks</a></dd></dl></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>Documentation</dt><dd data-v-0ad13d84><a href="/guide/develop/create-a-new-app.html" target="_self" data-v-0ad13d84>Quick start</a></dd><dd data-v-0ad13d84><a href="/guide/develop/setup-develop-environment.html" target="_self" data-v-0ad13d84>Developer guide</a></dd></dl></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>Resources</dt><dd data-v-0ad13d84><a href="/blog/write-a-blog.html" target="_self" data-v-0ad13d84>Blog</a></dd><dd data-v-0ad13d84><a href="/community/" target="_self" data-v-0ad13d84>Community</a></dd><dd data-v-0ad13d84><a href="/guide/contribute/thanks.html" target="_self" data-v-0ad13d84>Thanks by Weex</a></dd><dd data-v-0ad13d84><a href="https://www.apache.org/security/" target="_self" data-v-0ad13d84>Security</a></dd></dl></div></div><div class="copyright" data-v-0ad13d84><span data-v-0ad13d84>Copyright © 2018-2019 The Apache Software Foundation. Apache and the Apache feather
logo are trademarks of The Apache Software Foundation.</span></div></div></footer></div></div><!----></div></div>
<script src="/assets/js/app.0ff943f0.js" defer></script><script src="/assets/js/47.367f9103.js" defer></script>
</body>
</html>