http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/d332a30e/cn/guide/intro/app-architecture.html ---------------------------------------------------------------------- diff --git a/cn/guide/intro/app-architecture.html b/cn/guide/intro/app-architecture.html deleted file mode 100644 index 5eb837a..0000000 --- a/cn/guide/intro/app-architecture.html +++ /dev/null @@ -1,534 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <meta charset="utf-8"> - - <title>ç¨ Weex æ建移å¨åºç¨ | Weex</title> - <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> - <meta name="description" content="ç¨ Weex æ建移å¨åºç¨ä»å¤©ç移å¨åºç¨è¿éè°ä¸è° Weex 对移å¨åºç¨çç解ã 移å¨åºç¨éè¦æ¯æ并è¡ç åå¦ä»ç§»å¨åºç¨çå¼åéè¦å¹¶è¡ç åçè½åï¼å½ä¸ä¸ªç§»å¨åºç¨åå±å°ä¸å®è§æ¨¡çæ¶åï¼è½å¦æ¯æ大è§æ¨¡ç并è¡ç åå°±æ为äºä¸ä»¶éå¸¸å ³é®èåéè¦çäºæ ãå¦åå¾å®¹æåæå·¥ç¨ç¶é¢ã 移å¨åºç¨éè¦å¨ææ§å¦ä»ç§»å¨åºç¨ä¸è®ºä»ç åèå¥ãé¨ç½²ççµæ´»æ§åæ¶ææ§ãå 大å°ãè¿æ¯ä»ç åå°åå¸åå°åé¦çè¿ä»£å¨æä¸ï¼é½å移å¨äºèç½çåå±"> -<meta property="og:type" content="website"> -<meta property="og:title" content="ç¨ Weex æ建移å¨åºç¨"> -<meta property="og:url" content="https://weex-project.io/cn/guide/intro/app-architecture.html"> -<meta property="og:site_name" content="Weex"> -<meta property="og:description" content="ç¨ Weex æ建移å¨åºç¨ä»å¤©ç移å¨åºç¨è¿éè°ä¸è° Weex 对移å¨åºç¨çç解ã 移å¨åºç¨éè¦æ¯æ并è¡ç åå¦ä»ç§»å¨åºç¨çå¼åéè¦å¹¶è¡ç åçè½åï¼å½ä¸ä¸ªç§»å¨åºç¨åå±å°ä¸å®è§æ¨¡çæ¶åï¼è½å¦æ¯æ大è§æ¨¡ç并è¡ç åå°±æ为äºä¸ä»¶éå¸¸å ³é®èåéè¦çäºæ ãå¦åå¾å®¹æåæå·¥ç¨ç¶é¢ã 移å¨åºç¨éè¦å¨ææ§å¦ä»ç§»å¨åºç¨ä¸è®ºä»ç åèå¥ãé¨ç½²ççµæ´»æ§åæ¶ææ§ãå 大å°ãè¿æ¯ä»ç åå°åå¸åå°åé¦çè¿ä»£å¨æä¸ï¼é½å移å¨äºèç½çåå±"> -<meta property="og:updated_time" content="2017-04-28T02:36:21.000Z"> -<meta name="twitter:card" content="summary"> -<meta name="twitter:title" content="ç¨ Weex æ建移å¨åºç¨"> -<meta name="twitter:description" content="ç¨ Weex æ建移å¨åºç¨ä»å¤©ç移å¨åºç¨è¿éè°ä¸è° Weex 对移å¨åºç¨çç解ã 移å¨åºç¨éè¦æ¯æ并è¡ç åå¦ä»ç§»å¨åºç¨çå¼åéè¦å¹¶è¡ç åçè½åï¼å½ä¸ä¸ªç§»å¨åºç¨åå±å°ä¸å®è§æ¨¡çæ¶åï¼è½å¦æ¯æ大è§æ¨¡ç并è¡ç åå°±æ为äºä¸ä»¶éå¸¸å ³é®èåéè¦çäºæ ãå¦åå¾å®¹æåæå·¥ç¨ç¶é¢ã 移å¨åºç¨éè¦å¨ææ§å¦ä»ç§»å¨åºç¨ä¸è®ºä»ç åèå¥ãé¨ç½²ççµæ´»æ§åæ¶ææ§ãå 大å°ãè¿æ¯ä»ç åå°åå¸åå°åé¦çè¿ä»£å¨æä¸ï¼é½å移å¨äºèç½çåå±"> - - <link rel="alternate" href="/atom.xml" title="Weex" type="application/atom+xml"> - - - <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png"> - - - <link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css"> - - <link rel="stylesheet" href="/css/style.css"> - <link rel="stylesheet" href="/css/swiper.min.css"> -</head> - -<body id="guide" class="lang-cn"> - - <script> - window.PAGE_TYPE = "guide"; - window.ROOT = "/" - </script> - <header id="header"> - <div class="navbar"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <div class="main-nav"> - <ul class="links"> - <li><a href="/cn/guide">æç¨</a></li> - <li><a href="/cn/references">æå</a></li> - <li class="dropdown"> - <a href="javascript:;">åè</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/faq.html">FAQ</a> - </li> - <li> - <a href="/cn/releasenote.html">çæ¬è¯´æ</a> - </li> - </ul> - </li> - <li class="dropdown"> - <a href="javascript:;">å·¥å ·åæå¡</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/playground.html">Playground</a> - </li> - <li> - <a href="/cn/guide/tools/toolkit.html">Weex-toolkit</a> - </li> - <li> - <a href="http://dotwe.org" target="_blank">Code Snippets</a> - </li> - <li> - <a href="https://market.dotwe.org" target="_blank">Market</a> - </li> - </ul> - </li> - </ul> - <ul class="info"> - <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li> - </ul> - <ul class="tools"> - <li> - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-header" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - </li> - <li> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/app-architecture.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/app-architecture.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </li> - <!--<li></li>--> - </ul> - </div> - </div> - <div id="mobile-nav"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <a class="btn-menu"><span class="iconfont icon-nav"></span></a> - </div> -</header> - - <div id="sidebar" class=""> - <div class="sidebar-menu"> - - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-sidebar" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link current ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - - <a class="btn-close-sidebar iconfont icon-close"></a> - </div> -</div> - - <div class="article-wrapper page-layout"> - <div class="doc-nav"> - - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link current ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - </div> - - -<article class="article article-type-guide"> - <div class="article-entry" itemprop="articleBody"> - <header class="article-header"> - - - <h1 class="article-title" itemprop="name"> - ç¨ Weex æ建移å¨åºç¨ - </h1> - - - <time class="article-date" datetime="2017-04-28T02:36:21.000Z">Updated time: 28/04/2017</time> -</header> - <h1 id="ç¨-Weex-æ建移å¨åºç¨"><a href="#ç¨-Weex-æ建移å¨åºç¨" class="headerlink" title="ç¨ Weex æ建移å¨åºç¨"></a>ç¨ Weex æ建移å¨åºç¨</h1><h2 id="ä»å¤©ç移å¨åºç¨"><a href="#ä»å¤©ç移å¨åºç¨" class="headerlink" title="ä»å¤©ç移å¨åºç¨"></a>ä»å¤©ç移å¨åºç¨</h2><p>è¿éè°ä¸è° Weex 对移å¨åºç¨çç解ã</p> -<h3 id="移å¨åºç¨éè¦æ¯æ并è¡ç å"><a href="#移å¨åºç¨éè¦æ¯æ并è¡ç å" class="headerlink" title="移å¨åºç¨éè¦æ¯æ并è¡ç å"></a>移å¨åºç¨éè¦æ¯æ并è¡ç å</h3><p>å¦ä»ç§»å¨åºç¨çå¼åéè¦å¹¶è¡ç åçè½åï¼å½ä¸ä¸ªç§»å¨åºç¨åå±å°ä¸å®è§æ¨¡çæ¶åï¼è½å¦æ¯æ大è§æ¨¡ç并è¡ç åå°±æ为äºä¸ä»¶éå¸¸å ³é®èåéè¦çäºæ ãå¦åå¾å®¹æåæå·¥ç¨ç¶é¢ã</p> -<h3 id="移å¨åºç¨éè¦å¨ææ§"><a href="#移å¨åºç¨éè¦å¨ææ§" class="headerlink" title="移å¨åºç¨éè¦å¨ææ§"></a>移å¨åºç¨éè¦å¨ææ§</h3><p>å¦ä»ç§»å¨åºç¨ä¸è®ºä»ç åèå¥ãé¨ç½²ççµæ´»æ§åæ¶ææ§ãå 大å°ãè¿æ¯ä»ç åå°åå¸åå°åé¦çè¿ä»£å¨æä¸ï¼é½å移å¨äºèç½çåå±é度æä¸ç¸ç¬¦ã移å¨åºç¨éè¦æ´ç®åè½»éçç å模åï¼éè¦æè±çæ¬é¨ç½²åååç笨éè¿ç¨ã</p> -<h3 id="移å¨åºç¨éè¦å¼æ¾äºè"><a href="#移å¨åºç¨éè¦å¼æ¾äºè" class="headerlink" title="移å¨åºç¨éè¦å¼æ¾äºè"></a>移å¨åºç¨éè¦å¼æ¾äºè</h3><p>å¦ä»ç§»å¨åºç¨çå 容åä¿¡æ¯é½æ¯ç¸äºå¤ç«çï¼åºç¨ä¹é´ç交æµåå¾é常å¤æåå°é¾ï¼ä¹ç¼ºä¹ä¸å®çæ ååè§èåç容å¨æ¥æ¿è½½ã</p> -<h2 id="æ´ä½ç»æ设计"><a href="#æ´ä½ç»æ设计" class="headerlink" title="æ´ä½ç»æ设计"></a>æ´ä½ç»æ设计</h2><p>æ们认为ä¸ä¸ªå ·æé«å¹¶è¡ç åè½åãå¨æååæ ååè§èåç移å¨åºç¨åºè¯¥ç±ä»¥ä¸å 个æ¹é¢ææï¼</p> -<figure class="highlight plain"><table><tr><td class="code"><pre><div class="line">|------|------|------|------| |-----|</div><div class="line">| page | page | page | page | | api |</div><div class="line">|------|------|------|------| | api |</div><div class="line">| page | page | page | page | | api |</div><div class="line">|------|------|------|------| | api |</div><div class="line">| page | page | page | page | | api |</div><div class="line">|---------------------------| | api |</div><div class="line">| router | | api |</div><div class="line">|---------------------------| |-----|</div></pre></td></tr></table></figure> -<ul> -<li>页é¢ï¼é¦å 移å¨åºç¨åºè¯¥å¯ä»¥è¢«æ解æè¥å¹²ä¸ªé¡µé¢ï¼æ¯ä¸ªé¡µé¢ç¸å¯¹è§£è¦ç¬ç«ï¼åæ¶æ¯ä¸ªé¡µé¢é½æä¸ä¸ª URL è¿è¡å¯ä¸æ è¯ã</li> -<li>è·¯ç±ï¼è¿äºé¡µé¢å°ä¼éè¿è·¯ç±æºå¶ææºç串èèµ·æ¥ï¼é¡µé¢ä¹é´çå ³ç³»æ¯éè¿è·¯ç±æ¥è¿è¡è°åº¦çã常è§ç移å¨åºç¨è·¯ç±å æ¬å¯¼èªæ ãtab åæ¢çã</li> -<li>设å¤è½åï¼ä»¥åç§ API ææå¡çæ¹å¼æä¾åºæ¥ï¼ä¾é¡µé¢èªç±ä½¿ç¨ã</li> -</ul> -<p>è¿æ ·çè¯ï¼å¨æ建ä¸ä¸ªå®æ´ç移å¨åºç¨ä¹åï¼å ç¡®å®ä½ çåºç¨æå¤å°é¡µé¢ï¼æ¯ä¸ªé¡µé¢åå«æ¯ä»ä¹ URLï¼é¡µé¢ä¹é´çå ³èå跳转é»è¾æ¯ææ ·çï¼ç¶å梳çæ´ä¸ªç§»å¨åºç¨éè¦çææ API åæå¡ã</p> -<p>ç¶åéè¿ Weex å建ä¸åç页é¢ï¼å¹¶åå«è¿è¡å¼åãè°è¯ååå¸ã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="./page-architecture.html">页é¢ç»æ</a></li> -</ul> -<p>å¦æä½ å·²ç»æä¸ä¸ªå好ç移å¨åºç¨ï¼åªæ³ç¨ Weex å¼åå ¶ä¸çä¸é¨å页é¢çè³ä» ä» å ¶ä¸çä¸ä¸¤ä¸ªé¡µé¢ï¼è¿å¯¹ Weex æ¥è¯´å®å ¨ä¸æ¯é®é¢ãWeex åªæ¯ä¸ä¸ª SDKï¼å¯¹æ´ä½ç移å¨åºç¨æ¶æä¸ä¼äº§çä»»ä½ä¾µå ¥æ§ã并ä¸å®å ¨å¯ä»¥å纯 native çé¢æ hybrid 页é¢å ±åã</p> -<p>å¦æéè¦ WeexSDK é¢å¤çç»ä»¶ã模åæå ¶å®åè½ï¼å¯ä»¥éè¿ Weex çæ©å±æºå¶è¿è¡æ©å±ãè¿é¨åå·¥ä½éè¦ native çç åç¥è¯ï¼ä½æ¯éç Weex ç»ä»¶å模åç丰å¯ä»¥åä¸å¡è¿ä»£çæ·±å ¥ï¼è¿é¨åææ¬ä¼æ¿ä¸éåæ¶æçè¶å¿ã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/advanced/extend-to-ios.html">å¦ä½æ©å± iOS</a></li> -<li><a href="../../references/advanced/extend-to-android.html">å¦ä½æ©å± Android</a></li> -</ul> - - </div> - -</article> -</div> - - <footer id="footer"> - <div class="row clearfix"> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/app-architecture.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/app-architecture.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </div> - <div class="disclaimer"> - <div><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="200px" alt="Apache Incubator"></div> - <div><span class="title">Disclaimer:</span> Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache 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.</div> - <br/> - </div> - <hr> - <div class="row"> - <p> <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="50px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span> <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a></p> - </div> - <div class="row clearfix"> - <div></div> - </div> -</footer> - <div style="display: none;"> - <script src="//s95.cnzz.com/z_stat.php?id=1261496509&web_id=1261496509" language="JavaScript"></script> -</div> - - <script src="/js/reqwest.js"></script> - <script src="/js/common.js"></script> -</body> -</html>
http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/d332a30e/cn/guide/intro/how-it-works.html ---------------------------------------------------------------------- diff --git a/cn/guide/intro/how-it-works.html b/cn/guide/intro/how-it-works.html deleted file mode 100644 index 7e8ef06..0000000 --- a/cn/guide/intro/how-it-works.html +++ /dev/null @@ -1,542 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <meta charset="utf-8"> - - <title>å·¥ä½åç | Weex</title> - <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> - <meta name="description" content="å·¥ä½åçæ´ä½æ¶æWeex 表é¢ä¸æ¯ä¸ä¸ªå®¢æ·ç«¯ææ¯ï¼ä½å®é ä¸å®ä¸²èèµ·äºä»æ¬å°å¼åç¯å¢å°äºç«¯é¨ç½²åååçæ´ä¸ªé¾è·¯ãå¼åè é¦å å¯ä»¥å¨æ¬å°åæ°å web 页é¢ä¸æ ·æ°åä¸ä¸ª app ç页é¢ï¼ç¶åç¼è¯æä¸æ®µ JavaScript 代ç ï¼å½¢æ Weex çä¸ä¸ª JS bundleï¼å¨äºç«¯ï¼å¼åè å¯ä»¥æçæç JS bundle é¨ç½²ä¸å»ï¼ç¶åéè¿ç½ç»è¯·æ±æé¢ä¸åçæ¹å¼ä¼ éå°ç¨æ·ç移å¨åºç¨å®¢æ·ç«¯ï¼å¨ç§»å¨åºç¨å®¢æ·ç«¯"> -<meta property="og:type" content="website"> -<meta property="og:title" content="å·¥ä½åç"> -<meta property="og:url" content="https://weex-project.io/cn/guide/intro/how-it-works.html"> -<meta property="og:site_name" content="Weex"> -<meta property="og:description" content="å·¥ä½åçæ´ä½æ¶æWeex 表é¢ä¸æ¯ä¸ä¸ªå®¢æ·ç«¯ææ¯ï¼ä½å®é ä¸å®ä¸²èèµ·äºä»æ¬å°å¼åç¯å¢å°äºç«¯é¨ç½²åååçæ´ä¸ªé¾è·¯ãå¼åè é¦å å¯ä»¥å¨æ¬å°åæ°å web 页é¢ä¸æ ·æ°åä¸ä¸ª app ç页é¢ï¼ç¶åç¼è¯æä¸æ®µ JavaScript 代ç ï¼å½¢æ Weex çä¸ä¸ª JS bundleï¼å¨äºç«¯ï¼å¼åè å¯ä»¥æçæç JS bundle é¨ç½²ä¸å»ï¼ç¶åéè¿ç½ç»è¯·æ±æé¢ä¸åçæ¹å¼ä¼ éå°ç¨æ·ç移å¨åºç¨å®¢æ·ç«¯ï¼å¨ç§»å¨åºç¨å®¢æ·ç«¯"> -<meta property="og:image" content="https://weex-project.io/cn/guide/images/flow.png"> -<meta property="og:updated_time" content="2017-04-28T02:36:21.000Z"> -<meta name="twitter:card" content="summary"> -<meta name="twitter:title" content="å·¥ä½åç"> -<meta name="twitter:description" content="å·¥ä½åçæ´ä½æ¶æWeex 表é¢ä¸æ¯ä¸ä¸ªå®¢æ·ç«¯ææ¯ï¼ä½å®é ä¸å®ä¸²èèµ·äºä»æ¬å°å¼åç¯å¢å°äºç«¯é¨ç½²åååçæ´ä¸ªé¾è·¯ãå¼åè é¦å å¯ä»¥å¨æ¬å°åæ°å web 页é¢ä¸æ ·æ°åä¸ä¸ª app ç页é¢ï¼ç¶åç¼è¯æä¸æ®µ JavaScript 代ç ï¼å½¢æ Weex çä¸ä¸ª JS bundleï¼å¨äºç«¯ï¼å¼åè å¯ä»¥æçæç JS bundle é¨ç½²ä¸å»ï¼ç¶åéè¿ç½ç»è¯·æ±æé¢ä¸åçæ¹å¼ä¼ éå°ç¨æ·ç移å¨åºç¨å®¢æ·ç«¯ï¼å¨ç§»å¨åºç¨å®¢æ·ç«¯"> -<meta name="twitter:image" content="https://weex-project.io/cn/guide/images/flow.png"> - - <link rel="alternate" href="/atom.xml" title="Weex" type="application/atom+xml"> - - - <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png"> - - - <link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css"> - - <link rel="stylesheet" href="/css/style.css"> - <link rel="stylesheet" href="/css/swiper.min.css"> -</head> - -<body id="guide" class="lang-cn"> - - <script> - window.PAGE_TYPE = "guide"; - window.ROOT = "/" - </script> - <header id="header"> - <div class="navbar"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <div class="main-nav"> - <ul class="links"> - <li><a href="/cn/guide">æç¨</a></li> - <li><a href="/cn/references">æå</a></li> - <li class="dropdown"> - <a href="javascript:;">åè</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/faq.html">FAQ</a> - </li> - <li> - <a href="/cn/releasenote.html">çæ¬è¯´æ</a> - </li> - </ul> - </li> - <li class="dropdown"> - <a href="javascript:;">å·¥å ·åæå¡</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/playground.html">Playground</a> - </li> - <li> - <a href="/cn/guide/tools/toolkit.html">Weex-toolkit</a> - </li> - <li> - <a href="http://dotwe.org" target="_blank">Code Snippets</a> - </li> - <li> - <a href="https://market.dotwe.org" target="_blank">Market</a> - </li> - </ul> - </li> - </ul> - <ul class="info"> - <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li> - </ul> - <ul class="tools"> - <li> - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-header" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - </li> - <li> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/how-it-works.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/how-it-works.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </li> - <!--<li></li>--> - </ul> - </div> - </div> - <div id="mobile-nav"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <a class="btn-menu"><span class="iconfont icon-nav"></span></a> - </div> -</header> - - <div id="sidebar" class=""> - <div class="sidebar-menu"> - - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-sidebar" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link current ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - - <a class="btn-close-sidebar iconfont icon-close"></a> - </div> -</div> - - <div class="article-wrapper page-layout"> - <div class="doc-nav"> - - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link current ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - </div> - - -<article class="article article-type-guide"> - <div class="article-entry" itemprop="articleBody"> - <header class="article-header"> - - - <h1 class="article-title" itemprop="name"> - å·¥ä½åç - </h1> - - - <time class="article-date" datetime="2017-04-28T02:36:21.000Z">Updated time: 28/04/2017</time> -</header> - <h1 id="å·¥ä½åç"><a href="#å·¥ä½åç" class="headerlink" title="å·¥ä½åç"></a>å·¥ä½åç</h1><h2 id="æ´ä½æ¶æ"><a href="#æ´ä½æ¶æ" class="headerlink" title="æ´ä½æ¶æ"></a>æ´ä½æ¶æ</h2><p>Weex 表é¢ä¸æ¯ä¸ä¸ªå®¢æ·ç«¯ææ¯ï¼ä½å®é ä¸å®ä¸²èèµ·äºä»æ¬å°å¼åç¯å¢å°äºç«¯é¨ç½²åååçæ´ä¸ªé¾è·¯ãå¼åè é¦å å¯ä»¥å¨æ¬å°åæ°å web 页é¢ä¸æ ·æ°åä¸ä¸ª app ç页é¢ï¼ç¶åç¼è¯æä¸æ®µ JavaScript 代ç ï¼å½¢æ Weex çä¸ä¸ª JS bundleï¼å¨äºç«¯ï¼å¼åè å¯ä»¥æçæç JS bundle é¨ç½²ä¸å»ï¼ç¶åéè¿ç½ç»è¯·æ±æé¢ä¸åçæ¹å¼ä¼ éå°ç¨æ·ç移å¨åºç¨å®¢æ·ç«¯ï¼å¨ç§»å¨åºç¨å®¢æ·ç«¯éï¼WeexSDK ä¼åå¤å¥½ä¸ä¸ª JavaScript å¼æï¼å¹¶ä¸å¨ç¨æ·æå¼ä¸ä¸ª Weex 页é¢æ¶æ§è¡ç¸åºç JS bundleï¼å¹¶å¨æ§è¡è¿ç¨ä¸äº§çåç§å½ä»¤åéå° native 端è¿è¡ççé¢æ¸²æææ°æ®åå¨ãç½ç»éä¿¡ãè°ç¨è®¾å¤åè½ãç¨æ·äº¤äºååºç移å¨åºç¨çåºæ¯å®è·µï¼ åæ¶ï¼å¦æç¨æ·æ²¡æå®è£ 移å¨åºç¨ï¼ä»ä»ç¶å¯ä»¥å¨æµè§å¨éæå¼ä¸ä¸ªç¸åç web 页é¢ï¼è¿ä¸ªé¡µé¢æ¯ä½¿ç¨ç¸åç页é¢æºä»£ç ï¼éè¿æµè§å¨éç JavaScript å¼æè¿è¡èµ·æ¥çã</p> -<p><img src="../images/flow.png" alt="How it works"></p> -<h2 id="æ¬å°å¼åç¯å¢"><a href="#æ¬å°å¼åç¯å¢" class="headerlink" title="æ¬å°å¼åç¯å¢"></a>æ¬å°å¼åç¯å¢</h2><p>Weex çæ¬å°å¼åç¯å¢åºäº web å¼åä½éªè设计ï¼web å¼åè å¯ä»¥éè¿èªå·±çæç HTML/CSS/JavaScript ææ¯åè¯æ³å®ç°ç§»å¨åºç¨ççé¢ãåæ¶ Weex ä¹å¯¹ <a href="https://vuejs.org/" target="_blank" rel="external">Vue.js</a> è¿ä¸é常ä¼ç§çå端æ¡æ¶åäºå®æ¹çæ¯æã</p> -<p>é¤æ¤ä¹å¤ï¼Weex çå·¥ç¨è®¾è®¡ä¹æ¯ web å¼åè é常çæçï¼é¦å web å¼åè å¯ä»¥ä½¿ç¨èªå·±çæç npm è¿è¡ä¾èµç®¡çï¼å ¶æ¬¡ web å¼åè å¨éè¿é¡¹ç®èææ¶åå§åå·¥ç¨ãå¼åãè°è¯ãè´¨éæ§å¶çå个ç¯èï¼é½å¯ä»¥åè web å¼åå·²æçæä½³å®è·µã</p> -<p>åå¦ä» web å¼åçæä½³å®è·µä¸æ ·ï¼Weex ä¼æä¸ä¸ªé¡µé¢çæºä»£ç å ¨é¨ç¼è¯æå æä¸ä¸ª JS bundleï¼å¨æµè§å¨ä¸ï¼æ们éè¦æè¿ä¸ª JS bundle ä½ä¸ºä¸æ®µ <code><script></code> è½½å ¥ç½é¡µï¼å¨å®¢æ·ç«¯éï¼æ们æè¿æ®µ JS bundle è½½å ¥æ¬å°ï¼å¹¶éè¿ WeexSDK ç´æ¥æ§è¡ã</p> -<p><strong>ç¸å ³é 读</strong></p> -<ul> -<li><a href="../../references/platform-difference.html">Weex å web å¹³å°çå·®å¼</a></li> -<li><a href="../../references/vue/difference-with-web.html">Vue 2.x å¨ Weex å web ä¸çå·®å¼</a></li> -<li><a href="../index.html">å¿«éä¸æ</a></li> -<li><a href="./devtools.html">ä½¿ç¨ Devtools</a></li> -</ul> -<h2 id="äºç«¯é¨ç½²ååå"><a href="#äºç«¯é¨ç½²ååå" class="headerlink" title="äºç«¯é¨ç½²ååå"></a>äºç«¯é¨ç½²ååå</h2><p>Weex ç JS bundle å¯ä»¥ä½ä¸º web å¼åä¸çä¸æ®µéæèµæºè¿è¡é¨ç½²åä¸åãå ä¹å¯ä»¥å¤ç¨ HTML5 ææçå·¥ç¨ä½ç³»åæä½³å®è·µãæ¯å¦å¨æ¬å°å¼åç¯å¢éè¿é¨ç½²å·¥å ·å° JS bundle é¨ç½²å° CDNãéè¿ CMS ææ建平å°æä¸å¡æ°æ®å模ååçå端ç»ä»¶èªå¨åæ¼æ¥çæ JS bundleãéè¿æå¡ç«¯ JS bundle çæµéåæ¥å¿ç»è®¡é¡µé¢ç访é®æ åµãéè¿ AppCache æ类似çæ¹å¼å¯¹ JS bundle å¨å®¢æ·ç«¯è¿è¡ç¼åæé¢å 载以éä½ç½ç»éä¿¡çææ¬çã</p> -<h2 id="客æ·ç«¯-JavaScript-å¼æ"><a href="#客æ·ç«¯-JavaScript-å¼æ" class="headerlink" title="客æ·ç«¯ JavaScript å¼æ"></a>客æ·ç«¯ JavaScript å¼æ</h2><p>Weex ç iOS å Android 客æ·ç«¯ä¸é½ä¼è¿è¡ä¸ä¸ª JavaScript å¼æï¼æ¥æ§è¡ JS bundleï¼åæ¶åå端ç渲æå±åéè§èåçæ令ï¼è°åº¦å®¢æ·ç«¯ç渲æåå ¶å®åç§è½åãæä»¬å¨ iOS ä¸éæ©äº JavaScriptCore å æ ¸ï¼èå¨ Android ä¸éæ©äº UC æä¾ç v8 å æ ¸ãæ 论æ¯ä»æ§è½è¿æ¯ç¨³å®æ§æ¹é¢é½æä¾äºå¼ºæåçä¿éã</p> -<p>为äºè®©æ´ä¸ªç§»å¨åºç¨çèµæºå©ç¨å¾æ´å¥½ï¼æ们å¨å®¢æ·ç«¯æä¾ç JavaScript å¼ææ¯åä¾çï¼å³ææ JS bundle å ¬ç¨ä¸ä¸ª JavaScript å æ ¸å®ä¾ï¼åæ¶å¯¹æ¯ä¸ª JS bundle å¨è¿è¡æ¶è¿è¡äºä¸ä¸æçé离ï¼ä½¿å¾æ¯ä¸ª JS bundle é½è½å¤é«æå®å ¨çå·¥ä½ãæ们è¿æ Vue 2.0 è¿æ ·ç JS Framework åäºé¢ç½®ï¼å¼åè ä¸å¿ æ JS Framework æå å¨æ¯ä¸ª JS bundle éï¼ä»è大大åå°äº JS bundle çä½ç§¯ï¼ä¹å°±è¿ä¸æ¥ä¿éäºé¡µé¢æå¼çé度ã</p> -<h2 id="客æ·ç«¯æ¸²æå±"><a href="#客æ·ç«¯æ¸²æå±" class="headerlink" title="客æ·ç«¯æ¸²æå±"></a>客æ·ç«¯æ¸²æå±</h2><p>Weex ç®åæä¾äº iOS å Android 两个客æ·ç«¯ç native 渲æå±ãæ¯ä¸ªç«¯é½åºäº DOM 模å设计并å®ç°äºæ åççé¢æ¸²ææ¥å£ä¾ JavaScript å¼æè°ç¨ã并ä¸ç»å web æ åå native çç¹ç¹åä¼å¿å®ç°äºä¸å¥ç»ä¸çç»ä»¶å模åãWeex å¨æ§è½æ¹é¢ç表ç°ä¹æ¯é常ä¼å¼çï¼å°¤å ¶æ¯çé¢é¦å±å è½½æ¶é´ãnative ä¸é¿å表çèµæºå¼éåå¤ç¨æ åµãCPUãå åã帧ç çå ³é®ææ ãå½ç¶ï¼å°½ç®¡ Weex å®æ¹å·²ç»æä¾äºä¸ç»å¼åè æ常ç¨çç»ä»¶å模åï¼ä½é¢å¯¹ä¸°å¯å¤æ ·ç移å¨åºç¨ç åéæ±ï¼å¢éä¹é¾å ä¼åä¸ä»å¿ï¼ä¸ºæ¤æ们æä¾äºçµæ´»èªç±ç横åæ©å±è½åï¼å¼åè å¯ä»¥æ ¹æ®èªèº«çæ åµå®å¶å±äºèªå·±ç客æ·ç«¯ç»ä»¶å模åï¼è¿ä¸æ¥ä¸°å¯ Weex å¨å®¢æ·ç«¯ä¸çè½åã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/web-standards.html">Weex çç»ä»¶å模åè· web æ åçåºå«</a></li> -<li><a href="../../references/ios-apis.html">å¦ä½ä½¿ç¨ iOS</a></li> -<li><a href="../../references/android-apis.html">å¦ä½ä½¿ç¨ Android</a></li> -<li><a href="../../references/advanced/extend-to-ios.html">å¦ä½æ©å± iOS</a></li> -<li><a href="../../references/advanced/extend-to-android.html">å¦ä½æ©å± Android</a></li> -</ul> -<h2 id="æµè§å¨æ¸²æ"><a href="#æµè§å¨æ¸²æ" class="headerlink" title="æµè§å¨æ¸²æ"></a>æµè§å¨æ¸²æ</h2><p>Weex é¤äºæä¾ iOS å Android ç客æ·ç«¯æ¸²æå±ä¹å¤ï¼è¿åºäº Vue 2.0 对å®æ¹çææç»ä»¶å模åè¿è¡äºå°è£ ï¼å¼åè å¯ä»¥åºäº Vue 2.0 ç¨åä¸å¥æºä»£ç æ建åºå¨æµè§å¨ä¸ç¸åææç页é¢ã并ä¸åæ ·å¯ä»¥æ¨ªåæ©å±ã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/html5-apis.html">å¦ä½ä½¿ç¨ HTML5</a></li> -<li><a href="../../references/advanced/extend-to-html5.html">å¦ä½æ©å± HTML5</a></li> -</ul> - - </div> - -</article> -</div> - - <footer id="footer"> - <div class="row clearfix"> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/how-it-works.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/how-it-works.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </div> - <div class="disclaimer"> - <div><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="200px" alt="Apache Incubator"></div> - <div><span class="title">Disclaimer:</span> Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache 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.</div> - <br/> - </div> - <hr> - <div class="row"> - <p> <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="50px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span> <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a></p> - </div> - <div class="row clearfix"> - <div></div> - </div> -</footer> - <div style="display: none;"> - <script src="//s95.cnzz.com/z_stat.php?id=1261496509&web_id=1261496509" language="JavaScript"></script> -</div> - - <script src="/js/reqwest.js"></script> - <script src="/js/common.js"></script> -</body> -</html> http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/d332a30e/cn/guide/intro/index.html ---------------------------------------------------------------------- diff --git a/cn/guide/intro/index.html b/cn/guide/intro/index.html deleted file mode 100644 index cda7a0d..0000000 --- a/cn/guide/intro/index.html +++ /dev/null @@ -1,518 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <meta charset="utf-8"> - - <title>ä»ç» | Weex</title> - <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> - <meta name="description" content="Intro å·¥ä½åç Web å¼åä½éª ä½¿ç¨ Vue å¼å Weex é¡µé¢ ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡ ç¨ Weex æ建移å¨åºç¨ Weex 页é¢ç»æ"> -<meta property="og:type" content="website"> -<meta property="og:title" content="ä»ç»"> -<meta property="og:url" content="https://weex-project.io/cn/guide/intro/index.html"> -<meta property="og:site_name" content="Weex"> -<meta property="og:description" content="Intro å·¥ä½åç Web å¼åä½éª ä½¿ç¨ Vue å¼å Weex é¡µé¢ ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡ ç¨ Weex æ建移å¨åºç¨ Weex 页é¢ç»æ"> -<meta property="og:updated_time" content="2017-04-28T02:36:21.000Z"> -<meta name="twitter:card" content="summary"> -<meta name="twitter:title" content="ä»ç»"> -<meta name="twitter:description" content="Intro å·¥ä½åç Web å¼åä½éª ä½¿ç¨ Vue å¼å Weex é¡µé¢ ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡ ç¨ Weex æ建移å¨åºç¨ Weex 页é¢ç»æ"> - - <link rel="alternate" href="/atom.xml" title="Weex" type="application/atom+xml"> - - - <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png"> - - - <link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css"> - - <link rel="stylesheet" href="/css/style.css"> - <link rel="stylesheet" href="/css/swiper.min.css"> -</head> - -<body id="guide" class="lang-cn"> - - <script> - window.PAGE_TYPE = "guide"; - window.ROOT = "/" - </script> - <header id="header"> - <div class="navbar"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <div class="main-nav"> - <ul class="links"> - <li><a href="/cn/guide">æç¨</a></li> - <li><a href="/cn/references">æå</a></li> - <li class="dropdown"> - <a href="javascript:;">åè</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/faq.html">FAQ</a> - </li> - <li> - <a href="/cn/releasenote.html">çæ¬è¯´æ</a> - </li> - </ul> - </li> - <li class="dropdown"> - <a href="javascript:;">å·¥å ·åæå¡</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/playground.html">Playground</a> - </li> - <li> - <a href="/cn/guide/tools/toolkit.html">Weex-toolkit</a> - </li> - <li> - <a href="http://dotwe.org" target="_blank">Code Snippets</a> - </li> - <li> - <a href="https://market.dotwe.org" target="_blank">Market</a> - </li> - </ul> - </li> - </ul> - <ul class="info"> - <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li> - </ul> - <ul class="tools"> - <li> - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-header" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - </li> - <li> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/index.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/index.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </li> - <!--<li></li>--> - </ul> - </div> - </div> - <div id="mobile-nav"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <a class="btn-menu"><span class="iconfont icon-nav"></span></a> - </div> -</header> - - <div id="sidebar" class=""> - <div class="sidebar-menu"> - - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-sidebar" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link current ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - - <a class="btn-close-sidebar iconfont icon-close"></a> - </div> -</div> - - <div class="article-wrapper page-layout"> - <div class="doc-nav"> - - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link current ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - </div> - - -<article class="article article-type-guide"> - <div class="article-entry" itemprop="articleBody"> - <header class="article-header"> - - - <h1 class="article-title" itemprop="name"> - ä»ç» - </h1> - - - <time class="article-date" datetime="2017-04-28T02:36:21.000Z">Updated time: 28/04/2017</time> -</header> - <h1 id="Intro"><a href="#Intro" class="headerlink" title="Intro"></a>Intro</h1><ul> -<li><a href="./how-it-works.html">å·¥ä½åç</a></li> -<li><a href="./web-dev-experience.html">Web å¼åä½éª</a></li> -<li><a href="./using-vue.html">ä½¿ç¨ Vue å¼å Weex 页é¢</a></li> -<li><a href="./write-once.html">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a></li> -<li><a href="./app-architecture.html">ç¨ Weex æ建移å¨åºç¨</a></li> -<li><a href="./page-architecture.html">Weex 页é¢ç»æ</a></li> -</ul> - - </div> - -</article> -</div> - - <footer id="footer"> - <div class="row clearfix"> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/index.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/index.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </div> - <div class="disclaimer"> - <div><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="200px" alt="Apache Incubator"></div> - <div><span class="title">Disclaimer:</span> Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache 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.</div> - <br/> - </div> - <hr> - <div class="row"> - <p> <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="50px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span> <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a></p> - </div> - <div class="row clearfix"> - <div></div> - </div> -</footer> - <div style="display: none;"> - <script src="//s95.cnzz.com/z_stat.php?id=1261496509&web_id=1261496509" language="JavaScript"></script> -</div> - - <script src="/js/reqwest.js"></script> - <script src="/js/common.js"></script> -</body> -</html> http://git-wip-us.apache.org/repos/asf/incubator-weex-site/blob/d332a30e/cn/guide/intro/page-architecture.html ---------------------------------------------------------------------- diff --git a/cn/guide/intro/page-architecture.html b/cn/guide/intro/page-architecture.html deleted file mode 100644 index 32211ed..0000000 --- a/cn/guide/intro/page-architecture.html +++ /dev/null @@ -1,533 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <meta charset="utf-8"> - - <title>Weex 页é¢ç»æ | Weex</title> - <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> - <meta name="description" content="Weex 页é¢ç»æä¸ä¸ª Weex 页é¢å°±æ¯ä¸ä¸ªç¸å¯¹ç¬ç«è§£è¦ç移å¨åºç¨çé¢ï¼å®ä¸ä» å æ¬äºçé¢å±ç¤ºãæ´å å«äºé»è¾å¤çã设å¤è½å使ç¨ãçå½å¨æ管ççé¨åã çé¢DOM 模åWeex 页é¢éè¿ç±»ä¼¼ HTML DOM çæ¹å¼ç®¡ççé¢ï¼é¦å 页é¢ä¼è¢«å解为ä¸ä¸ª DOM æ ï¼ï¼æ¯ä¸ª DOM ç»ç¹é½ä»£è¡¨äºä¸ä¸ªç¸å¯¹ç¬ç«ç native è§å¾çåå ãç¶åä¸åçè§å¾åå ä¹é´éè¿æ å½¢ç»æç»åå¨äºä¸èµ·ï¼ææä¸ä¸ªå®æ´ç页é¢ã"> -<meta property="og:type" content="website"> -<meta property="og:title" content="Weex 页é¢ç»æ"> -<meta property="og:url" content="https://weex-project.io/cn/guide/intro/page-architecture.html"> -<meta property="og:site_name" content="Weex"> -<meta property="og:description" content="Weex 页é¢ç»æä¸ä¸ª Weex 页é¢å°±æ¯ä¸ä¸ªç¸å¯¹ç¬ç«è§£è¦ç移å¨åºç¨çé¢ï¼å®ä¸ä» å æ¬äºçé¢å±ç¤ºãæ´å å«äºé»è¾å¤çã设å¤è½å使ç¨ãçå½å¨æ管ççé¨åã çé¢DOM 模åWeex 页é¢éè¿ç±»ä¼¼ HTML DOM çæ¹å¼ç®¡ççé¢ï¼é¦å 页é¢ä¼è¢«å解为ä¸ä¸ª DOM æ ï¼ï¼æ¯ä¸ª DOM ç»ç¹é½ä»£è¡¨äºä¸ä¸ªç¸å¯¹ç¬ç«ç native è§å¾çåå ãç¶åä¸åçè§å¾åå ä¹é´éè¿æ å½¢ç»æç»åå¨äºä¸èµ·ï¼ææä¸ä¸ªå®æ´ç页é¢ã"> -<meta property="og:updated_time" content="2017-04-28T02:36:21.000Z"> -<meta name="twitter:card" content="summary"> -<meta name="twitter:title" content="Weex 页é¢ç»æ"> -<meta name="twitter:description" content="Weex 页é¢ç»æä¸ä¸ª Weex 页é¢å°±æ¯ä¸ä¸ªç¸å¯¹ç¬ç«è§£è¦ç移å¨åºç¨çé¢ï¼å®ä¸ä» å æ¬äºçé¢å±ç¤ºãæ´å å«äºé»è¾å¤çã设å¤è½å使ç¨ãçå½å¨æ管ççé¨åã çé¢DOM 模åWeex 页é¢éè¿ç±»ä¼¼ HTML DOM çæ¹å¼ç®¡ççé¢ï¼é¦å 页é¢ä¼è¢«å解为ä¸ä¸ª DOM æ ï¼ï¼æ¯ä¸ª DOM ç»ç¹é½ä»£è¡¨äºä¸ä¸ªç¸å¯¹ç¬ç«ç native è§å¾çåå ãç¶åä¸åçè§å¾åå ä¹é´éè¿æ å½¢ç»æç»åå¨äºä¸èµ·ï¼ææä¸ä¸ªå®æ´ç页é¢ã"> - - <link rel="alternate" href="/atom.xml" title="Weex" type="application/atom+xml"> - - - <link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png"> - - - <link href="//fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet" type="text/css"> - - <link rel="stylesheet" href="/css/style.css"> - <link rel="stylesheet" href="/css/swiper.min.css"> -</head> - -<body id="guide" class="lang-cn"> - - <script> - window.PAGE_TYPE = "guide"; - window.ROOT = "/" - </script> - <header id="header"> - <div class="navbar"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <div class="main-nav"> - <ul class="links"> - <li><a href="/cn/guide">æç¨</a></li> - <li><a href="/cn/references">æå</a></li> - <li class="dropdown"> - <a href="javascript:;">åè</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/faq.html">FAQ</a> - </li> - <li> - <a href="/cn/releasenote.html">çæ¬è¯´æ</a> - </li> - </ul> - </li> - <li class="dropdown"> - <a href="javascript:;">å·¥å ·åæå¡</a> - <ul class="dropdown-menu subnav"> - <li> - <a href="/cn/playground.html">Playground</a> - </li> - <li> - <a href="/cn/guide/tools/toolkit.html">Weex-toolkit</a> - </li> - <li> - <a href="http://dotwe.org" target="_blank">Code Snippets</a> - </li> - <li> - <a href="https://market.dotwe.org" target="_blank">Market</a> - </li> - </ul> - </li> - </ul> - <ul class="info"> - <li><a href="https://github.com/apache/incubator-weex/" target="_blank"><span class="btn-github iconfont icon-github"></span></a></li> - </ul> - <ul class="tools"> - <li> - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-header" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - </li> - <li> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/page-architecture.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/page-architecture.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </li> - <!--<li></li>--> - </ul> - </div> - </div> - <div id="mobile-nav"> - <a id="logo" href="/cn/"> - <img src="//img.alicdn.com/tps/TB1zBLaPXXXXXXeXXXXXXXXXXXX-121-59.svg" /> - </a> - <a class="btn-menu"><span class="iconfont icon-nav"></span></a> - </div> -</header> - - <div id="sidebar" class=""> - <div class="sidebar-menu"> - - <div class="search"> - <form id="search-form" class="search-form"> <!-- æç´¢æ¡ç¸å ³ --> - <input type="text" id="search-input-sidebar" name="q" results="0" class="form-control search-input" autocomplete="off" autocorrect="off"/> - <span class="iconfont icon-search"></span> - </form> - <div class="results-panel"> - </div> -</div> - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link current ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - - <a class="btn-close-sidebar iconfont icon-close"></a> - </div> -</div> - - <div class="article-wrapper page-layout"> - <div class="doc-nav"> - - - -<div class="doc-nav-version"> - <select class="versionBtn" stype="/cn/guide"> - - <option value="2v" selected>v2.x</option> - <option value="1v">v1.x</option> - - </select> -</div> -<div class="summary"> - <h2 class="part-title"> - - æç¨ - - </h2> - <ul class="doc-summary"> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - <li> - <h3 class="chapter-title"><a href="/cn/guide/index.html" class="sidebar-link ">å¿«éä¸æ</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/set-up-env.html" class="sidebar-link ">æ建å¼åç¯å¢</a> - </li> - - <li> - <a href="/cn/guide/integrate-to-your-app.html" class="sidebar-link ">éæ Weex å°å·²æåºç¨</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/intro/index.html" class="sidebar-link ">ä»ç»</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/intro/how-it-works.html" class="sidebar-link ">å·¥ä½åç</a> - </li> - - <li> - <a href="/cn/guide/intro/web-dev-experience.html" class="sidebar-link ">Web å¼åä½éª</a> - </li> - - <li> - <a href="/cn/guide/intro/using-vue.html" class="sidebar-link ">ä½¿ç¨ Vue å¼å Weex 页é¢</a> - </li> - - <li> - <a href="/cn/guide/intro/write-once.html" class="sidebar-link ">ä¸æ¬¡æ°åï¼å¤ç«¯è¿è¡</a> - </li> - - <li> - <a href="/cn/guide/intro/app-architecture.html" class="sidebar-link ">ç¨ Weex æ建移å¨åºç¨</a> - </li> - - <li> - <a href="/cn/guide/intro/page-architecture.html" class="sidebar-link current ">Weex 页é¢ç»æ</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/tools/index.html" class="sidebar-link ">å¨è¾¹å·¥å ·</a></h3> - - <ul class="chapter"> - - <li> - <a href="/cn/guide/tools/toolkit.html" class="sidebar-link ">ä½¿ç¨ weex-toolkit</a> - </li> - - </ul> - - </li> - - <li> - <h3 class="chapter-title"><a href="/cn/guide/contributing.html" class="sidebar-link ">å¦ä½åä¸ç¤¾åº</a></h3> - - </li> - - - </ul> -</div> - </div> - - -<article class="article article-type-guide"> - <div class="article-entry" itemprop="articleBody"> - <header class="article-header"> - - - <h1 class="article-title" itemprop="name"> - Weex 页é¢ç»æ - </h1> - - - <time class="article-date" datetime="2017-04-28T02:36:21.000Z">Updated time: 28/04/2017</time> -</header> - <h1 id="Weex-页é¢ç»æ"><a href="#Weex-页é¢ç»æ" class="headerlink" title="Weex 页é¢ç»æ"></a>Weex 页é¢ç»æ</h1><p>ä¸ä¸ª Weex 页é¢å°±æ¯ä¸ä¸ªç¸å¯¹ç¬ç«è§£è¦ç移å¨åºç¨çé¢ï¼å®ä¸ä» å æ¬äºçé¢å±ç¤ºãæ´å å«äºé»è¾å¤çã设å¤è½å使ç¨ãçå½å¨æ管ççé¨åã</p> -<h2 id="çé¢"><a href="#çé¢" class="headerlink" title="çé¢"></a>çé¢</h2><h3 id="DOM-模å"><a href="#DOM-模å" class="headerlink" title="DOM 模å"></a>DOM 模å</h3><p>Weex 页é¢éè¿ç±»ä¼¼ HTML DOM çæ¹å¼ç®¡ççé¢ï¼é¦å 页é¢ä¼è¢«å解为ä¸ä¸ª DOM æ ï¼ï¼æ¯ä¸ª DOM ç»ç¹é½ä»£è¡¨äºä¸ä¸ªç¸å¯¹ç¬ç«ç native è§å¾çåå ãç¶åä¸åçè§å¾åå ä¹é´éè¿æ å½¢ç»æç»åå¨äºä¸èµ·ï¼ææä¸ä¸ªå®æ´ç页é¢ã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/native-dom-api.html">Weex Native DOM APIs</a></li> -</ul> -<h3 id="ç»ä»¶"><a href="#ç»ä»¶" class="headerlink" title="ç»ä»¶"></a>ç»ä»¶</h3><p>Weex æ¯ææåãå¾çãè§é¢çå 容åç»ä»¶ï¼ä¹æ¯æ divãlistãscroller ç容å¨åç»ä»¶ï¼è¿å æ¬ sliderãinputãtextareaãswitch çå¤ç§ç¹æ®çç»ä»¶ãWeex ççé¢å°±æ¯ç±è¿äºç»ä»¶ä»¥ DOM æ çæ¹å¼æ建åºæ¥çã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/components/index.html">Weex ç»ä»¶å表</a></li> -</ul> -<h3 id="å¸å±ç³»ç»"><a href="#å¸å±ç³»ç»" class="headerlink" title="å¸å±ç³»ç»"></a>å¸å±ç³»ç»</h3><p>Weex 页é¢ä¸çç»ä»¶ä¼æç §ä¸å®çå¸å±è§èæ¥è¿è¡æå¸ï¼æ们è¿éæä¾äº CSS ä¸çç模åãflexbox å ç»å¯¹/ç¸å¯¹/åºå®/å¸éå¸å±è¿ä¸å¤§åå¸å±æ¨¡åã</p> -<ul> -<li>ç模åï¼éè¿å®½ãé«ãè¾¹æ¡ãå å¤è¾¹è·ãè¾¹æ¡ç CSS å±æ§æè¿°ä¸ä¸ªç»ä»¶æ¬èº«ç尺寸ã</li> -<li>flexboxï¼éè¿ CSS 3 Flexbox å¸å±è§èå®ä¹åæè¿°ç»ä»¶ä¹é´ç空é´åå¸æ åµã</li> -<li>positionï¼æ¯æ CSS position å±æ§ä¸ç <code>absolute</code>, <code>relative</code>, <code>fixed</code>, <code>sticky</code> ä½ç½®ç±»åï¼å ¶ä¸ <code>relative</code> æ¯é»è®¤å¼ã</li> -</ul> -<h2 id="åè½"><a href="#åè½" class="headerlink" title="åè½"></a>åè½</h2><p>Weex æä¾äºé常丰å¯çç³»ç»åè½ APIï¼å æ¬å¼¹åºåå¨ãç½ç»ã导èªã弹对è¯æ¡å toast çï¼å¼åè å¯ä»¥å¨ Weex 页é¢éè¿è·åä¸ä¸ª native module çæ¹å¼å¼å ¥å¹¶è°ç¨è¿äºå®¢æ·ç«¯åè½ APIã</p> -<p><strong>ç¸å ³é¾æ¥</strong></p> -<ul> -<li><a href="../../references/modules/index.html">Weex 模åå表</a></li> -</ul> -<h2 id="çå½å¨æ"><a href="#çå½å¨æ" class="headerlink" title="çå½å¨æ"></a>çå½å¨æ</h2><p>æ¯ä¸ª Weex 页é¢é½æå ¶èªèº«ççå½å¨æï¼é¡µé¢ä»å¼å§è¢«å建å°æå被éæ¯ï¼ä¼ç»åå°æ´ä¸ªè¿ç¨ãè¿æ¯éè¿å¯¹ Weex 页é¢çå建åéæ¯ï¼å¨è·¯ç±ä¸éè¿ SDK èªè¡å®ä¹å¹¶å®ç°çã</p> - - </div> - -</article> -</div> - - <footer id="footer"> - <div class="row clearfix"> - <div class="dropdown select-lang"> - <a href="javascript:;" class="dropdown-toggle"> - Language - <span class="caret"></span> - </a> - <ul class="dropdown-menu pick-lang"> - <li> - <a href="/guide/intro/page-architecture.html" data-lang="en">English</a> - </li> - <li> - <a href="/cn/guide/intro/page-architecture.html" data-lang="zh-cn">ä¸æ</a> - </li> - </ul> - </div> - </div> - <div class="disclaimer"> - <div><img src="//gw.alicdn.com/tfs/TB1pTBZQFXXXXX9XXXXXXXXXXXX-794-280.png" width="200px" alt="Apache Incubator"></div> - <div><span class="title">Disclaimer:</span> Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache 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.</div> - <br/> - </div> - <hr> - <div class="row"> - <p> <img src="//gw.alicdn.com/tfs/TB1bg8SQFXXXXcHXXXXXXXXXXXX-85-170.png" height="50px" alt="Apache"><span>Copyright(c) 2017 The Apache Software Foundation. Licensed under the </span> <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache License, Version 2.0</a></p> - </div> - <div class="row clearfix"> - <div></div> - </div> -</footer> - <div style="display: none;"> - <script src="//s95.cnzz.com/z_stat.php?id=1261496509&web_id=1261496509" language="JavaScript"></script> -</div> - - <script src="/js/reqwest.js"></script> - <script src="/js/common.js"></script> -</body> -</html>