<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>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/182.8341d23c.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/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/47.367f9103.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="/zh/" 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="/zh/guide/" class="nav-link router-link-active">指南</a></div><div class="nav-item"><a href="/zh/docs/" class="nav-link">文档</a></div><div class="nav-item"><a href="/zh/tools/" class="nav-link">第三方工具</a></div><div class="nav-item"><a href="/zh/download/" class="nav-link">下载</a></div><div class="nav-item"><a href="/zh/community/" class="nav-link">社区</a></div><div class="nav-item"><a href="/zh/blog/" class="nav-link">博客</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">选择语言</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/guide/extend/extend-ios.html" class="nav-link">English</a></li><li class="dropdown-item"><!----><a href="/zh/guide/extend/extend-ios.html" class="nav-link router-link-exact-active router-link-active">简体中文</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="/zh/guide/" class="nav-link router-link-active">指南</a></div><div class="nav-item"><a href="/zh/docs/" class="nav-link">文档</a></div><div class="nav-item"><a href="/zh/tools/" class="nav-link">第三方工具</a></div><div class="nav-item"><a href="/zh/download/" class="nav-link">下载</a></div><div class="nav-item"><a href="/zh/community/" class="nav-link">社区</a></div><div class="nav-item"><a href="/zh/blog/" class="nav-link">博客</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">选择语言</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/guide/extend/extend-ios.html" class="nav-link">English</a></li><li class="dropdown-item"><!----><a href="/zh/guide/extend/extend-ios.html" class="nav-link router-link-exact-active router-link-active">简体中文</a></li></ul></div></div></nav><ul class="sidebar-links"><li><div class="sidebar-group first"><p class="sidebar-heading"><span>快速上手</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/introduction.html" class="sidebar-link">简介</a></li><li><a href="/zh/guide/front-end-frameworks.html" class="sidebar-link">前端框架</a></li><li><a href="/zh/guide/platform-difference.html" class="sidebar-link">平台差异</a></li><li><a href="/zh/guide/use-vue-in-weex.html" class="sidebar-link">在Weex中使用Vue.js</a></li><li><a href="/zh/guide/use-rax-in-weex.html" class="sidebar-link">在Weex中使用Rax.js</a></li><li><a href="/zh/guide/playground.html" class="sidebar-link">Playground 应用</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>开发</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/develop/setup-develop-environment.html" class="sidebar-link">设置开发环境</a></li><li><a href="/zh/guide/develop/create-a-new-app.html" class="sidebar-link">创建一个新的app</a></li><li><a href="/zh/guide/develop/weex_cli.html" class="sidebar-link">Weex CLI</a></li><li><a href="/zh/guide/develop/integrate-to-android-app.html" class="sidebar-link">集成到Android应用</a></li><li><a href="/zh/guide/develop/integrate-to-iOS-app.html" class="sidebar-link">集成到iOS应用</a></li><li><a href="/zh/guide/develop/weex_error_code.html" class="sidebar-link">WEEX常见错误码</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>调试</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/debug/integrate-devtool-to-android.html" class="sidebar-link">集成Devtool到Android</a></li><li><a href="/zh/guide/debug/integrate-devtool-to-ios.html" class="sidebar-link">集成Devtool到iOS</a></li><li><a href="/zh/guide/debug/debug.html" class="sidebar-link">调试</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading open"><span>扩展</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/extend/extend-android.html" class="sidebar-link">扩展Android能力</a></li><li><a href="/zh/guide/extend/extend-ios.html" class="active sidebar-link">扩展iOS能力</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/zh/guide/extend/extend-ios.html#jsenv-扩展" class="sidebar-link">JSEnv 扩展</a></li><li class="sidebar-sub-header"><a href="/zh/guide/extend/extend-ios.html#自定义-module" class="sidebar-link">自定义 module</a></li><li class="sidebar-sub-header"><a href="/zh/guide/extend/extend-ios.html#扩展组件" class="sidebar-link">扩展组件</a></li><li class="sidebar-sub-header"><a href="/zh/guide/extend/extend-ios.html#获取组件的-css-样式" class="sidebar-link">获取组件的 CSS 样式</a></li><li class="sidebar-sub-header"><a href="/zh/guide/extend/extend-ios.html#自定义-handler" class="sidebar-link">自定义 handler</a></li></ul></li><li><a href="/zh/guide/extend/extend-ios-with-swift.html" class="sidebar-link">使用Swift扩展iOS能力</a></li><li><a href="/zh/guide/extend/extend-web.html" class="sidebar-link">扩展Web组件</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>高阶特性</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/advanced/asset-path.html" class="sidebar-link">资源路径</a></li><li><a href="/zh/guide/advanced/downgrade.html" class="sidebar-link">降级方案</a></li><li><a href="/zh/guide/advanced/use-vuex-and-vue-router.html" class="sidebar-link">使用Vuex和vue-router</a></li><li><a href="/zh/guide/advanced/multi-size-screen.html" class="sidebar-link">适应不同尺寸屏幕</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>贡献</span><!----></p><ul class="sidebar-group-items"><li><a href="/zh/guide/contribute/how-to-contribute.html" class="sidebar-link">加入 Weex 社区</a></li><li><a href="/zh/guide/contribute/thanks.html" class="sidebar-link">鸣谢</a></li></ul></div></li></ul></div><div class="page"><div class="content"><blockquote><p>注意：Weex 所有暴露给 JS 的内置 module 或 component API 都是安全和可控的，它们不会去访问系统的私有 API，也不会去做任何 runtime 上的 hack 更不会去改变应用原有的功能定位。<br>
如果需要扩展自定义的 module 或者 component ，一定注意不要将 OC 的 runtime 暴露给 JS ，不要将一些诸如 <code>dlopen()</code>， <code>dlsym()</code>， <code>respondsToSelector:</code>，<code>performSelector:</code>，<code>method_exchangeImplementations()</code> 的动态和不可控的方法暴露给JS，也不要将系统的私有API暴露给JS。否则将可能面临苹果上架审核问题。</p></blockquote><p>在这篇文档里，我们使用 Objective-C 来扩展 Weex 功能，如果想使用 Swift，可以参考 <a href="/zh/guide/extend/extend-ios-with-swift.html">使用 Swift 扩展</a>。</p><h2 id="jsenv-扩展"><a href="#jsenv-扩展" class="header-anchor">#</a> JSEnv 扩展</h2><h3 id="接口"><a href="#接口" class="header-anchor">#</a> 接口</h3><div class="language- extra-class"><pre class="language-text"><code>NSDictionary *options = @{@&quot;testVlaue&quot;:@&quot;hello&quot;};

[_instance renderWithURL:url options:options data:nil];

</code></pre></div><h3 id="使用"><a href="#使用" class="header-anchor">#</a> 使用</h3><div class="language- extra-class"><pre class="language-text"><code>var value = weex.config.testValue;

console.log(value);
</code></pre></div><h2 id="自定义-module"><a href="#自定义-module" class="header-anchor">#</a> 自定义 module</h2><p>自定义 module，需要让自己的 class 遵循 <code>WXModuleProtocol</code> 这个protocol，通过 <code>WX_EXPORT_METHOD</code> 这个宏暴露出需要透出到 <code>JavaScript</code> 调用的方法，再向 WeexSDK 注册 module，就可以完成一个简单 module 的自定义。</p><ol><li>新建一个基类为 NSObject 的 class <code>WXCustomEventModule</code>，让该类遵循 <code>WXModuleProtocol</code> 的协议。
<img src="https://img.alicdn.com/tfs/TB1LrZ8n7voK1RjSZPfXXXPKFXa-1042-264.png" width="100%"></li><li>添加打印的方法，通过 <code>WX_EXPORT_METHOD</code> 暴露该方法。
<img src="https://img.alicdn.com/tfs/TB156M9nZfpK1RjSZFOXXa6nFXa-1434-564.png" width="100%"></li><li>在初始化完成 Weex SDK 之后注册该 module。
<img src="https://img.alicdn.com/tfs/TB1IGo4nVzqK1RjSZFoXXbfcXXa-1420-122.png" width="100%"></li></ol><p>到此，我们已经完成了一个简单的 module 方法的封装，在 JS 里使用方法如下：</p><div class="language-Javascript extra-class"><pre class="language-javascript"><code>weex<span class="token punctuation">.</span><span class="token function">requireModule</span><span class="token punctuation">(</span><span class="token string">&quot;event&quot;</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">showParams</span><span class="token punctuation">(</span><span class="token string">&quot;hello Weex&quot;</span><span class="token punctuation">)</span>
</code></pre></div><h4 id="module-进阶"><a href="#module-进阶" class="header-anchor">#</a> Module 进阶</h4><p>关于 Module 和 Module 方法的执行特性（同步、异步；执行线程），需要了解：</p><ol><li><code>weexInstance</code><br>
在一个 Weex 页面中，默认 WXSDKInstance 的实例持有多个 module 的实例, 而 Module 的实例是是没有对 WXSDKInstance 做持有的，在自定义的 module 中添加 <code>@synthesize weexInstance</code>，module 实例可以对持有它本身的 WXSDKInstance 实例做一个弱引用，通过 weexInstance 可以拿到调用该 module 的页面的一些信息。</li><li><code>targetExecuteThread</code><br>
Module 方法默认会在 UI 线程（iOS 主线程）中被调用，建议不要在这做太多耗时的任务。如果你的任务不需要在 UI 线程执行或需要在特定线程执行，需要实现 <code>WXModuleProtocol</code> 中的 <code>- (NSThread *)</code> 的方法，并返回你希望方法执行所在的线程。</li><li><code>WXModuleKeepAliveCallback</code><br>
Module 支持返回值给 JavaScript 中的回调，回调的类型是 <code>WXModuleKeepAliveCallback</code>。回调的参数可以是 <code>String</code> 或者 <code>Map</code>。该 block 第一个参数为回调给 JavaScript 的数据，第二参数是一个 BOOL 值，表示该回调执行完成之后是否要被清除。JavaScript 每次调用都会产生一个回调，但是对于单独一次调用，是否要在完成该调用之后清除掉回调函数 id 就由这个选项控制，如非特殊场景，建议传 NO。</li><li><code>WX_EXPORT_METHOD_SYNC</code><br>
使用 <code>WX_EXPORT_METHOD</code> 暴露到前端的方法都是异步方法(获得结果需要通过回调函数获得)。如果期望获得同步调用结果，可以使用 <code>WX_EXPORT_METHOD_SYNC</code> 声明同步的 Module 方法。</li></ol><h2 id="扩展组件"><a href="#扩展组件" class="header-anchor">#</a> 扩展组件</h2><ol><li>新建一个基类为 <code>WXComponent</code> 的类。如果这个类里什么代码也不写，它和默认的的 <code>div</code> 组件能力是一致的。</li><li>覆盖 <code>WXComponent</code> 中的生命周期方法</li></ol><ul><li><code>loadView</code><br>
一个组件默认对应于一个 view，如果未覆盖 <code>loadView</code> 提供自定义 view，会让 <code>WXComponent</code> 基类创建 <code>WXView</code>。<code>WXView</code> 继承自 <code>UIView</code>。比如我们要实现一个组件支持地图功能，我们可以返回系统的 <code>MKMapView</code>。</li></ul><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (UIView *)loadView {
    return [MKMapView new];
}
</code></pre></div><ul><li><code>viewDidLoad</code>
对组件 view 需要做一些配置，比如设置 delegate，可以在 <code>viewDidLoad</code> 生命周期做。如果当前 view 没有添加 subview 的话，不要设置 view 的 frame，WeexSDK 会根据 style 进行排版后设置。</li></ul><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (void)viewDidLoad {
      ((MKMapView*)self.view).delegate = self;
}
</code></pre></div><ol start="3"><li>注册组件</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>[WXSDKEngine registerComponent:@&quot;map&quot; withClass:[WXMapComponent class]];
</code></pre></div><ol start="4"><li>在前端代码中使用新组件</li></ol><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>map</span><span class="token style-attr language-css"><span class="token attr-name"> <span class="token attr-name">style</span></span><span class="token punctuation">=&quot;</span><span class="token attr-value"><span class="token property">width</span><span class="token punctuation">:</span>200px<span class="token punctuation">;</span><span class="token property">height</span><span class="token punctuation">:</span>200px</span><span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>map</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>
</code></pre></div><h4 id="自定义事件"><a href="#自定义事件" class="header-anchor">#</a> 自定义事件</h4><ol><li>对于每个组件，WeexSDK 默认提供了一些事件能力，如点击等。假如想给我们的地图组件提供 <code>mapLoaded</code> 事件。</li></ol><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>map</span><span class="token style-attr language-css"><span class="token attr-name"> <span class="token attr-name">style</span></span><span class="token punctuation">=&quot;</span><span class="token attr-value"><span class="token property">width</span><span class="token punctuation">:</span>200px<span class="token punctuation">;</span><span class="token property">height</span><span class="token punctuation">:</span>200px</span><span class="token punctuation">&quot;</span></span> <span class="token attr-name">@mapLoaded</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>onMapLoaded<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>map</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">export</span> <span class="token keyword">default</span> <span class="token punctuation">{</span>
    methods<span class="token punctuation">:</span> <span class="token punctuation">{</span>
        <span class="token function-variable function">onMapLoaded</span><span class="token punctuation">:</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
            console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">&quot;map loaded&quot;</span><span class="token operator">+</span><span class="token constant">JSON</span><span class="token punctuation">.</span><span class="token function">stringify</span><span class="token punctuation">(</span>e<span class="token punctuation">)</span><span class="token punctuation">)</span>
        <span class="token punctuation">}</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><ol start="2"><li>覆盖组件生命周期方法，记录事件是否需要处理</li></ol><p>我们需要额外添加一个 <code>BOOL</code> 成员 <code>mapLoaded</code> 用来记录该事件是否生效。</p><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (void)addEvent:(NSString *)eventName {
    if ([eventName isEqualToString:@&quot;mapLoaded&quot;]) {
        _mapLoaded = YES;
    }
}

- (void)removeEvent:(NSString *)eventName {
    if ([eventName isEqualToString:@&quot;mapLoaded&quot;]) {
        _mapLoaded = NO;
    }
}
</code></pre></div><ol start="3"><li>给前端发送事件</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (void)mapViewDidFinishLoadingMap:(MKMapView *)mapView {
    if (_mapLoaded) {
        [self fireEvent:@&quot;mapLoaded&quot; params:@{@&quot;customKey&quot;:@&quot;customValue&quot;} domChanges:nil];
    }
}
</code></pre></div><h4 id="自定义属性"><a href="#自定义属性" class="header-anchor">#</a> 自定义属性</h4><p>给我们的地图组件添加一个新的属性 <code>showTraffic</code>。在前端代码里可以控制组件是否显示车流情况。</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>map</span><span class="token style-attr language-css"><span class="token attr-name"> <span class="token attr-name">style</span></span><span class="token punctuation">=&quot;</span><span class="token attr-value"><span class="token property">width</span><span class="token punctuation">:</span>200px<span class="token punctuation">;</span><span class="token property">height</span><span class="token punctuation">:</span>200px</span><span class="token punctuation">&quot;</span></span> <span class="token attr-name">showTraffic</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>true<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>map</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>
</code></pre></div><ol><li>覆盖组件初始化方法 <code>initWithRef...</code>
给组件添加一个成员变量记录 <code>showTraffic</code> 属性的值，并在 init 方法中初始化。</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (instancetype)initWithRef:(NSString *)ref type:(NSString *)type styles:(NSDictionary *)styles attributes:(NSDictionary *)attributes events:(NSArray *)events weexInstance:(WXSDKInstance *)weexInstance {
    if(self = [super initWithRef:ref type:type styles:styles attributes:attributes events:events weexInstance:weexInstance]) {
        if (attributes[@&quot;showsTraffic&quot;]) {
            _showsTraffic = [WXConvert BOOL: attributes[@&quot;showsTraffic&quot;]];
        }
    }
    return self;
}
</code></pre></div><ol start="2"><li>在生命期事件中记得将属性值同步给地图控件</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (void)viewDidLoad {
  ((MKMapView*)self.view).showsTraffic = _showsTraffic;
}
</code></pre></div><ol start="3"><li>当属性更新时，同步给地图控件</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>- (void)updateAttributes:(NSDictionary *)attributes {
    if (attributes[@&quot;showsTraffic&quot;]) {
        _showsTraffic = [WXConvert BOOL: attributes[@&quot;showsTraffic&quot;]];
        ((MKMapView*)self.view).showsTraffic = _showsTraffic;
    }
}
</code></pre></div><h4 id="更多的组件生命期方法"><a href="#更多的组件生命期方法" class="header-anchor">#</a> 更多的组件生命期方法</h4><p>组件是由 Weex 管理的，比如创建、布局、渲染、销毁。Weex 组件的生命周期方法都是可以重写的，你可以在这些生命周期中去做自己的事情。</p><table><thead><tr><th>方法</th><th>描述</th></tr></thead><tbody><tr><td>initWithRef:type:…</td><td>用给定的属性初始化一个component.</td></tr><tr><td>layoutDidFinish</td><td>在component完成布局时候会调用.</td></tr><tr><td>loadView</td><td>创建component管理的view.</td></tr><tr><td>viewWillLoad</td><td>在component的view加载之前会调用.</td></tr><tr><td>viewDidLoad</td><td>在component的view加载完之后调用.</td></tr><tr><td>viewWillUnload</td><td>在component的view被释放之前调用.</td></tr><tr><td>viewDidUnload</td><td>在component的view被释放之后调用.</td></tr><tr><td>updateStyles:</td><td>在component的style更新时候调用.</td></tr><tr><td>updateAttributes:</td><td>在component的attribute更新时候调用.</td></tr><tr><td>addEvent:</td><td>给component添加event的时候调用.</td></tr><tr><td>removeEvent:</td><td>在event移除的时候调用.</td></tr></tbody></table><h4 id="给组件添加方法"><a href="#给组件添加方法" class="header-anchor">#</a> 给组件添加方法</h4><p>在组件代码中使用宏 <code>WX_EXPORT_METHOD</code> 声明组件方法供前端调用。</p><div class="language-Objective-C extra-class"><pre class="language-text"><code>@implementation WXMyComponent

WX_EXPORT_METHOD(@selector(focus))

- (instancetype)initWithRef:(NSString *)ref type:(NSString *)type styles:(NSDictionary *)styles attributes:(NSDictionary *)attributes events:(NSArray *)events weexInstance:(WXSDKInstance *)weexInstance {
   if (self = [super initWithRef:ref type:type styles:styles attributes:attributes events:events weexInstance:weexInstance]) {
       // handle your attributes
       // handle your styles
   }

   return self;
}

- (void)focus {
    NSLog(@&quot;you got it&quot;);
}
@end
</code></pre></div><p>在 JS 中调用 <code>focus</code> 方法。</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>mycomponent</span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">'</span>mycomponent<span class="token punctuation">'</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>mycomponent</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">
  module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token punctuation">{</span>
    <span class="token function-variable function">created</span><span class="token punctuation">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
      <span class="token keyword">this</span><span class="token punctuation">.</span>$refs<span class="token punctuation">.</span>mycomponent<span class="token punctuation">.</span><span class="token function">focus</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</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="获取组件的-css-样式"><a href="#获取组件的-css-样式" class="header-anchor">#</a> 获取组件的 CSS 样式</h2><ol><li>在 0.19 版本之前，Weex 使用 Yoga 排版引擎，可以通过访问 WXComponent 的 cssNode 属性获取。例如：</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>self.cssNode-&gt;style.flex = 1.0;
float height = self.cssNode-&gt;style.dimensions[CSS_HEIGHT];
</code></pre></div><ol start="2"><li><p>从 0.19 版本开始，Weex 使用自已的排版引擎，是 C++ 代码。获取 CSS 属性可以从 WXComponent 的 styles 字典（NSDictionary）里获取，也可以访问 WXComponent 的 flexCssNode 属性，其类型为 C++ 类 WeexCore::WXCoreLayoutNode。注意，需要源文件为 .mm 类型。</p></li><li><p>从 0.20 版本开始，iOS 接入 WeexCore，排版引擎也沉入 WeexCore层，并且 CSS 相关属性不再上传给 WXComponent 对象，WXComponent 对象的 styles 字典里只有非 CSS 样式。我们的目的是上层 UI 组件只需要关心排版引擎生成的最终坐标即可，不需要关心前端标记的 CSS 属性。如果仍然需要获取 CSS 样式，可以在 .mm 文件中直接访问 flexCssNode，或通过 WXComponent+Layout.h 文件中提供的扩展方法。</p></li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>/**
 * @abstract Get css style value for key. The key should be of CSS standard form.
 *  This method is for convenience use in C/ObjC environment. And if you want to
 *  retrieve all style values or in C++, you could use flexCssNode directly.
 *
 *  Thread usage:
 *      This method should be invoked in component thread by WXPerformBlockOnComponentThread.
 *      Note that all initWithRef methods of WXComponent and its subclasses are performed in
 *      component thread by default. Therefore you can call this method directly in initWithRef.
 *
 *  Supported keys:
 *      width, height, min-width, min-height, max-width, max-height,
 *      margin-(left/right/top/bottom)
 *      padding-(left/right/top/bottom)
 *      border-(left/right/top/bottom)-width
 *      left, right, top, bottom
 *      flex-grow
 */
- (float)getCssStyleValueForKey:(NSString *)key;

// Other methods which should also be used in component thread.
- (WXCoreFlexDirection)getCssStyleFlexDirection;
- (WXCoreFlexWrap)getCssStyleFlexWrap;
- (WXCoreJustifyContent)getCssStyleJustifyContent;
- (WXCoreAlignItems)getCssStyleAlignItems;
- (WXCoreAlignSelf)getCssStyleAlignSelf;
- (WXCorePositionType)getCssStylePositionType;
- (WXCoreDirection)getCssDirection;
</code></pre></div><h2 id="自定义-handler"><a href="#自定义-handler" class="header-anchor">#</a> 自定义 handler</h2><p>Handler 的作用是什么？比如 WeexSDK 目前没有提供图片下载的能力，而是在 <code>WXImgLoaderProtocol</code> 定义了一些获取图片的接口。Image 组件正是通过 <code>WXImgLoaderProtocol</code> 获得并展示图片，开发者可以实现该 protocol 中的接口方法，这样 <code>image</code> 标签才能正常展示图片。</p><p>开发者也可以定义自己的 <code>protocol</code> 和对应的实现来使用 <code>handler</code> 机制。常见的一个场景就是在每个 App 中需要特定的 Handler 来实现一些公共的能力。</p><ol><li>新建基类为 NSObject 的类，并实现 <code>WXImgLoaderProtocol</code> 协议，实现 <code>WXImgLoaderProtocol</code> 的方法。
下面加载图片的逻辑需要依赖 SDWebImage，你也可以不依赖 SDWebimage 使用自己的方式加载对应 URL 图片。</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>@implementation WXImgLoaderDefaultImpl
- (id&lt;WXImageOperationProtocol&gt;)downloadImageWithURL:(NSString *)url imageFrame:(CGRect)imageFrame userInfo:(NSDictionary *)userInfo completed:(void(^)(UIImage *image,  NSError *error, BOOL finished))completedBlock {
    if ([url hasPrefix:@&quot;//&quot;]) {
        url = [@&quot;http:&quot; stringByAppendingString:url];
    }
    return (id&lt;WXImageOperationProtocol&gt;)[[SDWebImageManager sharedManager] downloadImageWithURL:[NSURL URLWithString:url] options:0 progress:^(NSInteger receivedSize, NSInteger expectedSize) {
    } completed:^(UIImage *image, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
    if (completedBlock) {
        completedBlock(image, error, finished);
    }
    }];
}
@end
</code></pre></div><ol start="2"><li>注册</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>[WXSDKEngine registerHandler:[WXImgLoaderDefaultImpl new] withProtocol:@protocol(WXImgLoaderProtocol)];
</code></pre></div><ol start="3"><li>使用</li></ol><div class="language-Objective-C extra-class"><pre class="language-text"><code>id&lt;WXImgLoaderProtocol&gt; imageLoader = [WXSDKEngine handlerForProtocol:@protocol(WXImgLoaderProtocol)];
[iamgeLoader downloadImageWithURL:imageURl imageFrame:frame userInfo:customParam completed:^(UIImage *image, NSError *error, BOOL finished) {
}];
</code></pre></div></div><div class="page-nav"><p class="inner"><span class="prev">
        ←
        <a href="/zh/guide/extend/extend-android.html" class="prev">
          扩展Android能力
        </a></span><span class="next"><a href="/zh/guide/extend/extend-ios-with-swift.html">
          使用Swift扩展iOS能力
        </a>
        →
      </span></p></div><div class="page-edit"><div class="last-updated"><span class="prefix">上次更新: </span><span class="time">2020/12/10</span></div><div class="edit-link"><a href="https://github.com/apache/incubator-weex-site/edit/master/docs/zh/guide/extend/extend-ios.md" target="_blank" rel="noopener noreferrer">编辑此页</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">提交建议</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">文档写得很棒</span><span class="choice"><img src="https://img.alicdn.com/tfs/TB1h7TSqpYqK1RjSZLeXXbXppXa-20-18.svg" class="score-icon bad">文档写得很差</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/182.8341d23c.js" defer></script>
  </body>
</html>