http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/textarea.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/components/textarea.md b/doc/source/cn/references/components/textarea.md deleted file mode 100644 index a5ec4d4..0000000 --- a/doc/source/cn/references/components/textarea.md +++ /dev/null @@ -1,162 +0,0 @@ ---- -title: <textarea> -type: references -order: 2.14 -version: 2.1 ---- - -# <textarea> - -<span class="weex-version">v0.8+</span> - -`textarea` æ¯ Weex å ç½®çä¸ä¸ªç»ä»¶ï¼ç¨äºç¨æ·äº¤äºï¼æ¥åç¨æ·è¾å ¥æ°æ®ã å¯ä»¥è®¤ä¸ºæ¯å 许å¤è¡ç `<input>` - -**Notes:** `<textarea>`æ¯æ `<input>` æ¯æçææçäºä»¶ã - -## åç»ä»¶ - -`textarea` ç»ä»¶ä¸æ¯æåç»ä»¶ã - -## ç¹æ§ - -- `value {string}`ï¼ç»ä»¶çæ¥æ¶å°çè¾å ¥å符ã -- `placeholder {string}`ï¼æ示ç¨æ·å¯ä»¥è¾å ¥ä»ä¹ã æ示ææ¬ä¸è½æå车ææ¢è¡ã -- `disabled {boolean}`ï¼è¡¨ç¤ºæ¯å¦æ¯æè¾å ¥ãé常 `click` äºä»¶å¨ `disabled` æ§ä»¶ä¸æ¯å¤±æçã -- `autofocus {boolean}`ï¼è¡¨ç¤ºæ¯å¦å¨é¡µé¢å è½½æ¶æ§ä»¶èªå¨è·å¾è¾å ¥ç¦ç¹ã -- `rows {number}`ï¼æ¥æ¶ number ç±»åçæ°æ®ï¼æå®ç»ä»¶çé«åº¦ï¼é»è®¤å¼æ¯ 2 - -## æ ·å¼ - -- 伪类<span class="api-version">v0.9.5+</span>: `textarea` æ¯æ以ä¸ä¼ªç±»ï¼ - - * `active` - * `focus` - * `disabled` - * `enabled` - -- text styles - - æ¯æ `color` - - æ¯æ `font-size` - - æ¯æ `font-style` - - æ¯æ `font-weight` - - æ¯æ `text-align` - - æ¥ç [ææ¬æ ·å¼](../text-style.html) - -- éç¨æ ·å¼ï¼æ¯æææéç¨æ ·å¼ - - - ç模å - - `flexbox` å¸å± - - `position` - - `opacity` - - `background-color` - - æ¥ç [ç»ä»¶éç¨æ ·å¼](../common-style.html) - -## äºä»¶ - -- `input`: è¾å ¥å符çå¼æ´æ¹ã - - äºä»¶ä¸ event 对象å±æ§ï¼ - - - `value`: 触åäºä»¶çç»ä»¶ï¼ - - `timestamp`: äºä»¶åçæ¶çæ¶é´æ³ã - -- `change`: å½ç¨æ·è¾å ¥å®ææ¶è§¦åãé常å¨Â `blur` äºä»¶ä¹åã - - äºä»¶ä¸ event 对象å±æ§ï¼ - - - `value`: 触åäºä»¶çç»ä»¶ï¼ - - - `timestamp`: äºä»¶åçæ¶çæ¶é´æ³ã - -- `focus`: ç»ä»¶è·å¾è¾å ¥ç¦ç¹ã - - äºä»¶ä¸ event 对象å±æ§ï¼ - - - `timestamp`: äºä»¶åçæ¶çæ¶é´æ³ã - -- `blur`: ç»ä»¶å¤±å»è¾å ¥ç¦ç¹ã - - äºä»¶ä¸ event 对象å±æ§ï¼ - - - `timestamp`: äºä»¶åçæ¶çæ¶é´æ³ã - -- éç¨äºä»¶ - - **注æï¼** - ä¸æ¯æ `click` äºä»¶ã 请çå¬ `input` æ `change` äºä»¶ä»£æ¿ã - - æ¯æ以ä¸éç¨äºä»¶ï¼ - - - `longpress` - - `appear` - - `disappear` - - æ¥ç [éç¨äºä»¶](../common-event.html) - -## ç¤ºä¾ - -```html -<template> - <div class="wrapper"> - <textarea class="textarea" @input="oninput" @change="onchange" @focus="onfocus" @blur="onblur"></textarea> - </div> -</template> - -<script> - const modal = weex.requireModule('modal') - - export default { - methods: { - oninput (event) { - console.log('oninput:', event.value) - modal.toast({ - message: `oninput: ${event.value}`, - duration: 0.8 - }) - }, - onchange (event) { - console.log('onchange:', event.value) - modal.toast({ - message: `onchange: ${event.value}`, - duration: 0.8 - }) - }, - onfocus (event) { - console.log('onfocus:', event.value) - modal.toast({ - message: `onfocus: ${event.value}`, - duration: 0.8 - }) - }, - onblur (event) { - console.log('onblur:', event.value) - modal.toast({ - message: `input blur: ${event.value}`, - duration: 0.8 - }) - } - } - } -</script> - -<style> - .textarea { - font-size: 50px; - width: 650px; - margin-top: 50px; - margin-left: 50px; - padding-top: 20px; - padding-bottom: 20px; - padding-left: 20px; - padding-right: 20px; - color: #666666; - border-width: 2px; - border-style: solid; - border-color: #41B883; - } -</style> -``` - -[try it](http://dotwe.org/vue/a1877866e8b91ffa1e6ea9bc66c200fa)
http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/video.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/components/video.md b/doc/source/cn/references/components/video.md deleted file mode 100644 index eee6eb9..0000000 --- a/doc/source/cn/references/components/video.md +++ /dev/null @@ -1,94 +0,0 @@ ---- -title: <video> -type: references -order: 2.15 -version: 2.1 ---- - -# <video> - -<span class="weex-version">v0.6.1+</span> - -`<video>` ç»ä»¶å¯ä»¥è®©æä»¬å¨ Weex 页é¢ä¸åµå ¥è§é¢å 容ã - -## åç»ä»¶ - -- `<text>` æ¯å¯ä¸åæ³çåç»ä»¶ã - -### ç¹æ§ - -- `src {string}`ï¼å åµçè§é¢æåçURL -- `play-status {string}`ï¼å¯éå¼ä¸º `play` | `pause`ï¼ç¨æ¥æ§å¶è§é¢çææ¾ç¶æï¼`play` æè `pause`ï¼é»è®¤å¼æ¯ `pause`ã -- `auto-play {boolean}`ï¼å¯éå¼ä¸º `true` | `false`ï¼å½é¡µé¢å è½½åå§åå®æåï¼ç¨æ¥æ§å¶è§é¢æ¯å¦ç«å³ææ¾ï¼é»è®¤å¼æ¯ `false`ã - -## æ ·å¼ - -- éç¨æ ·å¼ï¼æ¯æææéç¨æ ·å¼ - - - ç模å - - `flexbox` å¸å± - - `position` - - `opacity` - - `background-color` - - æ¥ç [ç»ä»¶éç¨æ ·å¼](../common-style.html) - -## äºä»¶ - -- `start`ï¼å½ playback çç¶ææ¯ Playing æ¶è§¦å -- `pause`ï¼å½ playback çç¶ææ¯ Paused æ¶è§¦å -- `finish`ï¼å½ playback çç¶ææ¯ Finished æ¶è§¦å -- `fail`ï¼å½ playback ç¶ææ¯ Failed æ¶è§¦å - -## ç¤ºä¾ - -```html -<template> - <div> - <video class="video" :src="src" autoplay controls - @start="onstart" @pause="onpause" @finish="onfinish" @fail="onfail"></video> - <text class="info">state: {{state}}</text> - </div> -</template> - -<style scoped> - .video { - width: 630px; - height: 350px; - margin-top: 60px; - margin-left: 60px; - } - .info { - margin-top: 40px; - font-size: 40px; - text-align: center; - } -</style> - -<script> - export default { - data () { - return { - state: '----', - src:'http://flv2.bn.netease.com/videolib3/1611/01/XGqSL5981/SD/XGqSL5981-mobile.mp4' - } - }, - methods:{ - onstart (event) { - this.state = 'onstart' - }, - onpause (event) { - this.state = 'onpause' - }, - onfinish (event) { - this.state = 'onfinish' - }, - onfail (event) { - this.state = 'onfinish' - } - } - } -</script> -``` - -[try it](http://dotwe.org/vue/01d3d27073a471bb234b1a76e130d197) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/waterfall.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/components/waterfall.md b/doc/source/cn/references/components/waterfall.md deleted file mode 100644 index 169ec89..0000000 --- a/doc/source/cn/references/components/waterfall.md +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: <waterfall> -type: references -order: 2.5 -version: 2.1 ---- - -# waterfall - -<span class="weex-version">v0.11.0+</span> - -æä¾çå¸æµå¸å±çç»ä»¶ - -### åç»ä»¶ - -注æ: ålistä¸æ ·, waterfall åªæ¯æç¹å®ç±»åçç»ä»¶: cell, header, refresh, loading å fixed-position ç»ä»¶. - -- `cell`: çå¸æµä¸çæ¯ä¸ªå ç´ -- `header`: 主è¦ç¨äºè¡¨ç¤ºæ¨ªè·¨å¤åçå ç´ ï¼å¯ä»¥éè¿cssçpositionå±æ§è®¾ç½®ä¸ºsticky - -### ç¹æ§ - -- **column-width** : æè¿°çå¸æµæ¯ä¸åçå宽 - - `auto`: æå³çå宽æ¯è¢«å ¶ä»å±æ§æå³å®ç(æ¯å¦ column-count) - - `<length>`: æä½³å宽ï¼å®é çå宽å¯è½ä¼æ´å®½(éè¦å¡«å å©ä½ç空é´)ï¼ æè æ´çª(å¦æå©ä½ç©ºé´æ¯å宽è¿è¦å°)ã 该å¼å¿ 须大äº0 -- **column-count**: æè¿°çå¸æµçåæ° - - `auto`: æå³çåæ°æ¯è¢«å ¶ä»å±æ§æå³å®ç(æ¯å¦ column-width) - - `<integer>`: æä½³åæ°ï¼column-width å column-count é½æå®é0å¼ï¼ å column-count 代表æ大åæ°ã -- **column-gap**: åä¸åçé´é. å¦ææå®äº `normal` ï¼åå¯¹åº `32`. - -å ¶ä»æ¯æçå±æ§åè§ [List Component Attributes](./list.html) - -### æ ·å¼ - -éç¨æ ·å¼ï¼æ¯æææéç¨æ ·å¼ - -- ç模å -- `flexbox` å¸å± -- `position` -- `opacity` -- `background-color` - -æ¥ç [ç»ä»¶éç¨æ ·å¼](../common-style.html) - -### äºä»¶ - -- éç¨äºä»¶ - - æ¯æææéç¨äºä»¶ï¼ - - - `click` - - `longpress` - - `appear` - - `disappear` - - æ¥ç [éç¨äºä»¶](../common-event.html) - -### API - -æ»å¨å°å表æ个æå®é¡¹æ¯å¸¸è§éæ±ï¼`<waterfall>` æå±äºè¯¥åè½æ¯ææ»å¨å°æå® `<cell>` æè `<header>`ãéè¿ `dom` module 访é®ï¼æ´å¤ä¿¡æ¯å¯åè [dom module](../modules/dom.html) ã - -### ç¤ºä¾ - -åè§ [playground waterfall example](http://dotwe.org/vue/7a9195643e9e8da352b0d879cdbe68c0) \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/web.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/components/web.md b/doc/source/cn/references/components/web.md deleted file mode 100644 index 42f0681..0000000 --- a/doc/source/cn/references/components/web.md +++ /dev/null @@ -1,155 +0,0 @@ ---- -title: <web> -type: references -order: 2.16 -version: 2.1 ---- - -# <web> - -<span class="weex-version">v0.5+</span> - -ä½¿ç¨ `<web>` ç»ä»¶å¨ Weex 页é¢ä¸åµå ¥ä¸å¼ ç½é¡µå 容ã`src` å±æ§ç¨æ¥æå®èµæºå°åãä½ ä¹å¯ä»¥ä½¿ç¨ `webview module` æ¥æ§å¶ `web` çè¡ä¸ºï¼æ¯å¦åè¿ãåéåéè½½ãå¯ä»¥å¨è¿éæ¥ç [`webview` module](../modules/webview.html)ã - -## åç»ä»¶ - -ä¸æ¯æåç»ä»¶ã - -## ç¹æ§ - -- `src {string}`ï¼æ¤ç¹æ§æå®åµå ¥ç web é¡µé¢ urlã - -## æ ·å¼ - -- éç¨æ ·å¼ï¼ä¸æ¯æé¨åç模åæ ·å¼ï¼æ¯æå表å¦ä¸ï¼ - - - `width` - - ç»ä»¶ç宽度ï¼é»è®¤å¼æ¯0ãè¿ä¸ªæ ·å¼å®ä¹å¿ é¡»æå®æ°å¼ã - - - `height` - - ç»ä»¶çé«åº¦ï¼é»è®¤å¼æ¯0ãè¿ä¸ªæ ·å¼å®ä¹å¿ é¡»æå®æ°å¼ã - - - `flexbox` å¸å± - - `position` - - `opacity` - - `background-color` - - æ¥ç [ç»ä»¶éç¨æ ·å¼](../common-style.html) - -## äºä»¶ - -- `pagestart`: `<web>` ç»ä»¶å¼å§å è½½æ¶åéæ¤äºä»¶æ¶æ¯ã -- `pagefinish`: `<web>` ç»ä»¶å®æå è½½æ¶åéæ¤äºä»¶æ¶æ¯ã -- `error`: å¦æ `<web>` ç»ä»¶å è½½åºç°é误ï¼ä¼åéæ¤äºä»¶æ¶æ¯ã - -- éç¨äºä»¶ - - æ¯æ以ä¸éç¨äºä»¶ï¼ - - `appear` - - `disappear` - - æ¥ç [éç¨äºä»¶](../common-event.html) - -**注æï¼** - -ä¸æ¯æ `click` äºä»¶ã - -## ç¤ºä¾ - -æ们ç¨ä¸ä¸ªç®ææµè§å¨ç¤ºä¾ï¼æ¥å±ç¤ºå¦ä½ä½¿ç¨ `<web>` ç»ä»¶å `webview` moduleã æ¥ç [webview module](../modules/webview.html)ã - -```html -<template> - <div class="wrapper"> - <div class="group"> - <input class="input" v-model="value" ref="input" type="url" autofocus="false"></input> - </div> - <div class="group"> - <text class="button" @click="loadURL">LoadURL</text> - <text class="button" @click="reload">reload</text> - </div> - <web ref="webview" :src="url" class="webview" @pagestart="start" @pagefinish="finish" @error="error"></web> - </div> -</template> - -<script> - const webview = weex.requireModule('webview') - const modal = weex.requireModule('modal') - - export default { - data () { - return { - url : 'https://m.alibaba.com', - value: 'https://m.alibaba.com' - } - }, - methods: { - loadURL (event) { - this.url = this.value - modal.toast({ message: 'load url:' + this.url }) - setTimeout(() => { - console.log('will go back.') - modal.toast({ message: 'will go back' }) - webview.goBack(this.$refs.webview) - }, 10000) - }, - reload (event) { - console.log('will reload webview') - modal.toast({ message: 'reload' }) - webview.reload(this.$refs.webview) - }, - start (event) { - console.log('pagestart', event) - modal.toast({ message: 'pagestart' }) - }, - finish (event) { - console.log('pagefinish', event) - modal.toast({ message: 'pagefinish' }) - }, - error (event) { - console.log('error', event) - modal.toast({ message: 'error' }) - } - } - } -</script> - -<style scoped> - .group { - flex-direction: row; - justify-content: space-around; - margin-top: 20px; - } - .input { - width: 600px; - font-size: 36px; - padding-top: 15px; - padding-bottom: 15px; - border-width: 2px; - border-style: solid; - border-color: #BBBBBB; - } - .button { - width: 225px; - text-align: center; - background-color: #D3D3D3; - padding-top: 15px; - padding-bottom: 15px; - margin-bottom: 30px; - font-size: 30px; - } - - .webview { - margin-left: 75px; - width: 600px; - height: 750px; - border-width: 2px; - border-style: solid; - border-color: #41B883; - } -</style> -``` - -[try it](http://dotwe.org/vue/221ff37113a12d692a7a92a100f20162) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/downgrade.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/downgrade.md b/doc/source/cn/references/downgrade.md deleted file mode 100644 index 1393c2b..0000000 --- a/doc/source/cn/references/downgrade.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: é级æ¹æ¡ -type: references -order: 1.3 -version: 2.1 ---- - -# é级æ¹æ¡ - -Weex 2.0 é级æ¹æ¡æ¹æ模åçå½¢å¼æ¯æï¼å ·ä½è¯·åè[downgrade](https://www.npmjs.com/package/@weex-project/downgrade) - http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/gesture.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/gesture.md b/doc/source/cn/references/gesture.md deleted file mode 100644 index be81e45..0000000 --- a/doc/source/cn/references/gesture.md +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: æå¿ -type: references -order: 1.7 -version: 2.1 ---- - -# æå¿ - -*注ï¼è¯¥åè½å±äºå®éªæ§åè½* - -Weex å°è£ äºåçç触æ¸äºä»¶ä»¥æä¾æå¿ç³»ç»ã使ç¨æå¿ç±»ä¼¼äºå¨ Weex ä¸ä½¿ç¨äºä»¶ï¼åªéå¨èç¹ä¸è®¾ç½® `on` ç¹æ§æ¥çå¬æå¿å³å¯ã - -## æå¿ç±»å - -ç®åï¼ä» æ¯æ以ä¸åç§æå¿ç±»åï¼ - -- **Touch**ï¼å½è§¦æ¸å°ä¸ä¸ªç¹ï¼ç§»å¨æä»è§¦æ¸é¢ç§»å¼æ¶è§¦å `touch` æå¿ã触æ¸æå¿å¾ç²¾åï¼å®ä¼è¿åææ详ç»çäºä»¶ä¿¡æ¯ãæ以ï¼çå¬ `touch` æå¿å¯è½å¾æ ¢ï¼å³ä½¿åªç§»å¨ä¸ä¸ç¹ä¹éè¦å¤ç大éäºä»¶ãæä¸ç§ç±»åç `touch` æå¿ï¼ - - - `touchstart` å°å¨è§¦æ¸å°è§¦æ¸é¢ä¸æ¶è§¦åã - - `touchmove` å°å¨è§¦æ¸ç¹å¨è§¦æ¸é¢ç§»å¨æ¶è¢«è§¦åã - - `touchend` å°å¨ä»è§¦æ¸é¢ç¦»å¼æ¶è¢«è§¦åã - -- **Pan**ï¼`pan` æå¿ä¹ä¼è¿å触æ¸ç¹å¨è§¦æ¸é¢ç移å¨ä¿¡æ¯ï¼æç¹ç±»ä¼¼äº `touch` æå¿ãä½æ¯ `pan` æå¿åªä¼éæ ·æ¶éé¨åäºä»¶ä¿¡æ¯å æ¤æ¯ `touch` äºä»¶è¦å¿«å¾å¤ï¼å½ç¶ç²¾åæ§å·®äº `touch`ã`pan` ä¹æä¸ä¸ç±»åçæå¿ï¼è¿äºæå¿çæä¹ä¸ `touch` å®å ¨ä¸æ ·ï¼ - - - `panstart` - - `panmove` - - `panend` - - `horizontalpan` <span class="api-version">v0.10+</span>ï¼æå¿ç `start/move/end` ç¶æä¿åå¨ `state` ç¹æ§ä¸ãç®å该æå¿å¨ Android ä¸ä¼ä¸ click äºä»¶å²çªã - - `verticalpan` <span class="api-version">v0.10+</span>ï¼å¿ç `start/move/end` ç¶æä¿åå¨ `state` ç¹æ§ä¸ãç®å该æå¿å¨ Android ä¸ä¼ä¸ click äºä»¶å²çªã -- **Swipe**ï¼`swipe` å°ä¼å¨ç¨æ·å¨å±å¹ä¸æ»å¨æ¶è§¦åï¼ä¸æ¬¡è¿ç»çæ»å¨åªä¼è§¦åä¸æ¬¡ `swiper` æå¿ã -- **LongPress**ï¼`LongPress` å°ä¼å¨è§¦æ¸ç¹è¿ç»ä¿æ 500 ms以ä¸æ¶è§¦åã - -`touch` å `pan` é常æ¥è¿ï¼å®ä»¬çç¹ç¹å¯ä»¥æ»ç»æè¿æ ·ï¼ - -- **Touch**ï¼å®æ´ä¿¡æ¯ï¼ç²¾åãå¾æ ¢ -- **Pan**ï¼æ½æ ·ä¿¡æ¯ï¼å¾å¿«ï¼ä¸å¤ç²¾å - -å¼åè å¯ä»¥æ ¹æ®èªå·±çæ åµéæ©åéçæå¿ã - -## å±æ§ - -以ä¸å±æ§å¯ä»¥å¨æå¿çåè°ä¸ä½¿ç¨ï¼ - -- `direction`ï¼ä» å¨ `swipe` æå¿ä¸åå¨ï¼è¿åæ»å¨æ¹åï¼è¿åå¼å¯è½ä¸º `up`, `left`, `bottom`, `right`ã -- `changedTouches`ï¼ä¸ä¸ªæ°ç»ï¼å å«äºå½åæå¿ç触æ¸ç¹çè¿å¨è½¨è¿¹ - -### changedTouches - -`changedTouches` æ¯ä¸ä¸ªæ°ç»ï¼å ¶åå ç´ ä¸å å«ä»¥ä¸å±æ§ï¼ - -- `identifier`ï¼è§¦æ¸ç¹çå¯ä¸æ è¯ç¬¦ã -- `pageX`ï¼è§¦æ¸ç¹ç¸å¯¹äºæ档左侧边ç¼ç X è½´åæ ã -- `pageY`ï¼è§¦æ¸ç¹ç¸å¯¹äºæ档顶é¨è¾¹ç¼ç Y è½´åæ ã -- `screenX`ï¼è§¦æ¸ç¹ç¸å¯¹äºå±å¹å·¦ä¾§è¾¹ç¼ç X è½´åæ ã -- `screenY`ï¼è§¦æ¸ç¹ç¸å¯¹äºå±å¹é¡¶é¨è¾¹ç¼ç Y è½´åæ ã - -## 约æ - -ç®åï¼ç±äºä¼è§¦å大éäºä»¶å²çªï¼Weex Android è¿ä¸æ¯æå¨æ»å¨ç±»åçå ç´ ä¸çå¬æå¿ï¼ä¾å¦ `scroller`, `list` å `webview` è¿ä¸ä¸ªç»ä»¶ã http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/html5-apis.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/html5-apis.md b/doc/source/cn/references/html5-apis.md deleted file mode 100644 index a8c802a..0000000 --- a/doc/source/cn/references/html5-apis.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: HTML5 APIs -type: references -order: 1.3 -version: 2.1 ---- - -# HTML5 APIs - -Weex HTML5 APIs ä¸ [Vue APIs](https://vuejs.org/v2/api/) ä¿æä¸è´ï¼è¯·ç´æ¥åè [Vue APIs](https://vuejs.org/v2/api/)ã \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/Artboard.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/Artboard.jpg b/doc/source/cn/references/images/Artboard.jpg deleted file mode 100644 index 2f6bb95..0000000 Binary files a/doc/source/cn/references/images/Artboard.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/coding_weex_1.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/coding_weex_1.jpg b/doc/source/cn/references/images/coding_weex_1.jpg deleted file mode 100644 index 8080578..0000000 Binary files a/doc/source/cn/references/images/coding_weex_1.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/css-boxmodel.png ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/css-boxmodel.png b/doc/source/cn/references/images/css-boxmodel.png deleted file mode 100644 index a2063e2..0000000 Binary files a/doc/source/cn/references/images/css-boxmodel.png and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/css-flexbox-align.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/css-flexbox-align.jpg b/doc/source/cn/references/images/css-flexbox-align.jpg deleted file mode 100644 index 8a7f731..0000000 Binary files a/doc/source/cn/references/images/css-flexbox-align.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/css-flexbox-justify.svg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/css-flexbox-justify.svg b/doc/source/cn/references/images/css-flexbox-justify.svg deleted file mode 100644 index 33e742b..0000000 --- a/doc/source/cn/references/images/css-flexbox-justify.svg +++ /dev/null @@ -1,59 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg"; width='504' height='270' viewBox="0 0 504 270"> - <defs> - <pattern id='checker' width='20' height='20' patternUnits='userSpaceOnUse'> - <rect x='0' y='0' width='10' height='10' fill='#eee' /> - <rect x='10' y='10' width='10' height='10' fill='#eee' /> - <rect x='0' y='10' width='10' height='10' fill='#ccc' /> - <rect x='10' y='0' width='10' height='10' fill='#ccc' /> - </pattern> - </defs> - <style> - text { font-family: sans-serif; font-weight: bold; font-size: 30px; text-anchor: middle; } - rect { stroke-width: 2px; stroke: #888; } - g > rect:nth-child(1) { fill: #888 } - g > rect:nth-child(2) { fill: #fcc; } - g > rect:nth-child(3) { fill: #cfc; } - g > rect:nth-child(4) { fill: #ccf; } - g > rect:nth-child(5) { fill: transparent; } - </style> - <g transform="translate(2,2)"> - <rect x='0' y='0' width='500' height='50' /> - <rect x='0' y='0' width='100' height='50' /> - <rect x='100' y='0' width='80' height='50' /> - <rect x='180' y='0' width='200' height='50' /> - <rect x='0' y='0' width='500' height='50' /> - <text x='250' y='38'>flex-start</text> - </g> - <g transform="translate(2,56)"> - <rect x='0' y='0' width='500' height='50' /> - <rect x='120' y='0' width='100' height='50' /> - <rect x='220' y='0' width='80' height='50' /> - <rect x='300' y='0' width='200' height='50' /> - <rect x='0' y='0' width='500' height='50' /> - <text x='250' y='38'>flex-end</text> - </g> - <g transform="translate(2,110)"> - <rect x='0' y='0' width='500' height='50' /> - <rect x='60' y='0' width='100' height='50' /> - <rect x='160' y='0' width='80' height='50' /> - <rect x='240' y='0' width='200' height='50' /> - <rect x='0' y='0' width='500' height='50' /> - <text x='250' y='38'>center</text> - </g> - <g transform="translate(2,164)"> - <rect x='0' y='0' width='500' height='50' /> - <rect x='0' y='0' width='100' height='50' /> - <rect x='160' y='0' width='80' height='50' /> - <rect x='300' y='0' width='200' height='50' /> - <rect x='0' y='0' width='500' height='50' /> - <text x='250' y='38'>space-between</text> - </g> - <g transform="translate(2,218)"> - <rect x='0' y='0' width='500' height='50' /> - <rect x='20' y='0' width='100' height='50' /> - <rect x='160' y='0' width='80' height='50' /> - <rect x='280' y='0' width='200' height='50' /> - <rect x='0' y='0' width='500' height='50' /> - <text x='250' y='38'>space-around</text> - </g> -</svg> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/css-flexbox-sample.png ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/css-flexbox-sample.png b/doc/source/cn/references/images/css-flexbox-sample.png deleted file mode 100644 index 0f1236d..0000000 Binary files a/doc/source/cn/references/images/css-flexbox-sample.png and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/div_1.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/div_1.jpg b/doc/source/cn/references/images/div_1.jpg deleted file mode 100644 index 3c89773..0000000 Binary files a/doc/source/cn/references/images/div_1.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/div_2.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/div_2.jpg b/doc/source/cn/references/images/div_2.jpg deleted file mode 100644 index 67395bb..0000000 Binary files a/doc/source/cn/references/images/div_2.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/div_3.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/div_3.jpg b/doc/source/cn/references/images/div_3.jpg deleted file mode 100644 index b10f69e..0000000 Binary files a/doc/source/cn/references/images/div_3.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/div_4.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/div_4.jpg b/doc/source/cn/references/images/div_4.jpg deleted file mode 100644 index acc2518..0000000 Binary files a/doc/source/cn/references/images/div_4.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/image_1.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/image_1.jpg b/doc/source/cn/references/images/image_1.jpg deleted file mode 100644 index b87de15..0000000 Binary files a/doc/source/cn/references/images/image_1.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/image_2.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/image_2.jpg b/doc/source/cn/references/images/image_2.jpg deleted file mode 100644 index 598a242..0000000 Binary files a/doc/source/cn/references/images/image_2.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/list_2.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/list_2.jpg b/doc/source/cn/references/images/list_2.jpg deleted file mode 100644 index 8c2cc55..0000000 Binary files a/doc/source/cn/references/images/list_2.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/list_3.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/list_3.jpg b/doc/source/cn/references/images/list_3.jpg deleted file mode 100644 index f2968c7..0000000 Binary files a/doc/source/cn/references/images/list_3.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/list_4.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/list_4.jpg b/doc/source/cn/references/images/list_4.jpg deleted file mode 100644 index 0123171..0000000 Binary files a/doc/source/cn/references/images/list_4.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/nav.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/nav.jpg b/doc/source/cn/references/images/nav.jpg deleted file mode 100644 index 8c6ed03..0000000 Binary files a/doc/source/cn/references/images/nav.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/nav.png ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/nav.png b/doc/source/cn/references/images/nav.png deleted file mode 100644 index 7081ca7..0000000 Binary files a/doc/source/cn/references/images/nav.png and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/scroller_1.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/scroller_1.jpg b/doc/source/cn/references/images/scroller_1.jpg deleted file mode 100644 index 3e995cb..0000000 Binary files a/doc/source/cn/references/images/scroller_1.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/style_1.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/style_1.jpg b/doc/source/cn/references/images/style_1.jpg deleted file mode 100644 index 2482710..0000000 Binary files a/doc/source/cn/references/images/style_1.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/images/style_2.jpg ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/images/style_2.jpg b/doc/source/cn/references/images/style_2.jpg deleted file mode 100644 index 6b6f2e1..0000000 Binary files a/doc/source/cn/references/images/style_2.jpg and /dev/null differ http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/index.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/index.md b/doc/source/cn/references/index.md deleted file mode 100644 index 9988c3c..0000000 --- a/doc/source/cn/references/index.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -title: éç¨ç¹æ§ -type: references -order: 1 -version: 2.1 ---- - -# éç¨ç¹æ§ - -- [iOS APIs](./ios-apis.html) -- [Android APIs](./android-apis.html) -- [HTML5 APIs](./html5-apis.html) -- [éç¨æ ·å¼](./common-style.html) -- [ææ¬æ ·å¼](./text-style.html) -- [é¢è²å称](./color-names.html) -- [æå¿](./gesture.html) -- [è·¯å¾](./path.html) -- [äºä»¶å泡](./bubble.html) -- [é级æ¹æ¡](./downgrade.html) \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/ios-apis.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/ios-apis.md b/doc/source/cn/references/ios-apis.md deleted file mode 100644 index 0668923..0000000 --- a/doc/source/cn/references/ios-apis.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -title: iOS APIs -type: references -order: 1.1 -version: 2.1 ---- - -# iOS APIs - -## Native 对å¤æ¥å£ - - - 注å SDK é»è®¤ç ModuleãHandler å Component - - 注åèªå®ä¹ moduleãHandler å Component - - éç½® JSFramework - -## Handler (对åºäº Android ç Adapter) ä»ç» - -- `WXImgLoaderDefaultImpl` å¾çä¸è½½ handlerãWeex ä¼æéè¦è®¾ç½®å¾çç View å URL éé²åºæ¥ï¼Native 端éè¦å®ç°è¿ä¸ªæ¥å£è¿è¡å¾çä¸è½½ãWeexSDK kernel æ¬èº«æ²¡ææä¾å¾çä¸è½½çé»è®¤å®ç°ã - - æ¥å£å®ä¹å¦ä¸ï¼ - - ```object-c - @protocol WXImgLoaderProtocol <WXModuleProtocol> - /** - * @abstract Creates a image download handler with a given URL - * - * @param imageUrl The URL of the image to download - * - * @param imageFrame The frame of the image you want to set - * - * @param options : The options to be used for this download - * - * @param completedBlock : A block called once the download is completed. - * image : the image which has been download to local. - * error : the error which has happened in download. - * finished : a Boolean value indicating whether download action has finished. - */ - - (id<WXImageOperationProtocol>)downloadImageWithURL:(NSString *)url imageFrame:(CGRect)imageFrame userInfo:(NSDictionary *)options completed:(void(^)(UIImage *image, NSError *error, BOOL finished))completedBlock; - @end - ``` - -## Native å JS éä¿¡ - -- èªå®ä¹éç¥äºä»¶ - - ç¨äº native èªå®ä¹é¨åå js è¿è¡å®è·µéç¥ï¼æ¯å¦ä¼ éä¸æäºä»¶å° jsï¼è¿ä¸ªæ¯å¨ component åºç±»çæ¹æ³ï¼å¯ä»¥ç´æ¥ä½¿ç¨ - - ``` - /** - * @abstract Fire an event to the component and tell Javascript which value has been changed. - * @param eventName äºä»¶å称ï¼å¯ä»¥å¨weexæ件æ个æ ç¾ç»ä»¶çå¬ï¼å½åè§è为 onXXX - * @param params æ°æ® - * @param domChanges åçæ¹åçæ°æ® - **/ - - (void)fireEvent:(NSString *)eventName params:(NSDictionary *)params domChanges:(NSDictionary *)domChanges - ``` - -- äºä»¶åè° - - å¤ç¨äº Module åè°ç»æç» jsï¼åè°ç±»åå为ä¸é¢ä¸¤ç§ï¼ - - 1. `WXModuleCallback` 为äºæ§è½èèï¼è¯¥åè°åªè½åè°éç¥jsä¸æ¬¡ï¼ä¹åä¼è¢«éæ¾ï¼å¤ç¨äºä¸æ¬¡ç»æ - - 2. `WXModuleKeepAliveCallback` 该åè°å¯ä»¥è®¾ç½®æ¯å¦ä¸ºå¤æ¬¡åè°ç±»åï¼å¤æ¬¡åè°çåºæ¯å¦æç»çå¬ä½ç½®çååï¼å¹¶è¿åç» jsã - - ``` - @implementation WXEchoModule - @synthesize weexInstance; // 让该module è·å¾å½åinstance - WX_EXPORT_METHOD(@selector(echo:)) - - (void)echo:(NSString *)param callback:(WXModuleKeepAliveCallback)callback - { - callback(param,ture);// æ¤å¤è®¾ç½®trueï¼è¯¥åè°function å¯ä»¥å¤æ¬¡åè°æ§è¡ï¼å¯ä»¥å循ç¯æµè¯. - } - ``` - -## å¨æéé å®¹å¨ - -WeexSDK å¨ `WXSDKInstance` ç±»ä¸æä¾äºæ¹æ³ `setFrame(CGRect)` æ¥æ¹å容å¨ç大å°ã - -å¦ï¼å¨å¯¼èªæ ä»æå°æ è¿ç¨ï¼éè¦ weexView çååï¼ å¯ä»¥å¨æ¤æ¶ native è°ç¨è¯¥æ¹æ³è®¾ç½® - - -## éçº§ä½¿ç¨ - -Weex å¤äºåå±é¶æ®µä¼å¢å ä¸äºæ°çç¹æ§ååè½ï¼ä½æ¯è¿äºæ°çç¹æ§ååè½é½å¿ é¡»å级 SDK æè½å®ç°ï¼å¯¹äºæ²¡æå级çåºç¨åºè¯¥æä¹å¤çå¢ï¼å¯ä»¥ä½¿ç¨é级åè½ã - -æè°é级åè½å°±æ¯ Weex æ æ³è¿è¡ççæ¬æè ææºï¼å¯ä»¥ç¨ Weex h5 æ¥ä»£æ¿ã - -Native 端å¯ä»¥éè¿æ¥å£ WXSDKInstance ä¸ç onFailed åè°è¿è¡å¤çï¼å¦ææ¯ä¸»å¨é级åè¿åçé误 domain 为 `TemplateErrorType`ï¼Native 端å¯ä»¥è·³è½¬å°å¯¹åºç H5 页é¢ï¼æè ç¨å ¶ä»çæ¹å¼æ示ç¨æ·å½åç¯å¢ä¸æ¯æ Weexã - - \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/js-service/index.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/js-service/index.md b/doc/source/cn/references/js-service/index.md deleted file mode 100644 index d4004d5..0000000 --- a/doc/source/cn/references/js-service/index.md +++ /dev/null @@ -1,118 +0,0 @@ ---- -title: JS Service -type: references -order: 9 -version: 2.1 ---- - - -# JS Service - -<span class="weex-version">v0.9.5+</span> - -JS service å Weex å®ä¾å¨ JS runtime ä¸å¹¶è¡è¿è¡ãWeex å®ä¾ççå½å¨æå¯è°ç¨ JS service çå½å¨æãç®åæä¾å建ãå·æ°ãéæ¯çå½å¨æã - -**éè¦æé: JS Service é常强大ä½ä¹å¾å±é©ï¼è¯·å°å¿ä½¿ç¨ï¼** - - -## 注å JS Service - -### iOS - -```objective-c -[WeexSDKEngine registerService:@"SERVICE_NAME" withScript: @"SERVICE_JS_CODE" withOptions: @{}]; -``` - -### Android - -```java -HashMap<String, String> options = new HashMap<>() -options.put("k1", "v1") -String SERVICE_NAME = "SERVICE_NAME" -String SERVICE_JS_CODE = "SERVICE_JS_CODE" -boolean result = WXSDKEngine.registerService(SERVICE_NAME, SERVICE_JS_CODE, options) -``` - -### Web -```html -<!-- å¿ é¡»å¨ JSFM ä¹åå è½½ --> -<script src="SERVICE_JS_CODE_URL"></script> -``` - - - -## ç¼åä¸ä¸ª JS service - -```javascript -// options: native inject options -// options.serviceName is native options name -service.register(options.serviceName, { - /** - * JS Service lifecycle. JS Service `create` will before then each instance lifecycle `create`. The return param `instance` is Weex protected param. This object will return to instance global. Other params will in the `services` at instance. - * - * @param {String} id instance id - * @param {Object} env device environment - * @return {Object} - */ - create: function(id, env, config) { - return { - instance: { - InstanceService: function(weex) { - var modal = weex.requireModule('modal') - return { - toast: function(title) { - modal.toast({ message: title }) - } - } - } - }, - NormalService: function(weex) { - var modal = weex.requireModule('modal') - return { - toast: function(title) { - modal.toast({ message: title }) - } - } - } - } - }, - - /** - * JS Service lifecycle. JS Service `refresh` will before then each instance lifecycle `refresh`. If you want to reset variable or something on instance refresh. - * - * @param {String} id instance id - * @param {Object} env device environment - */ - refresh: function(id, env, config){ - - }, - - /** - * JS Service lifecycle. JS Service `destroy` will before then each instance lifecycle `destroy`. You can deleted variable here. If you doesn't detete variable define in JS Service. The variable will always in the js runtime. It's would be memory leak risk. - * - * @param {String} id instance id - * @param {Object} env device environment - * @return {Object} - */ - destroy: function(id, env) { - - } -}) -``` - -## Using JS Service (vuejs) - -```html -<script> -var _InstanceService = new InstanceService(weex) -var _NormalService = new service.normalService(weex) - -module.exports = { - created: fucntion() { - // called modal module to toast something - _InstanceService.toast('Instance JS Service') - _NormalService.toast('Normal JS Service') - } -} -</script> -``` http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/jsfm-apis.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/jsfm-apis.md b/doc/source/cn/references/jsfm-apis.md deleted file mode 100644 index ffe6029..0000000 --- a/doc/source/cn/references/jsfm-apis.md +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: JS Framework APIs -type: references -order: 1.3 -version: 2.1 ---- - -# JS Framework APIs - -## BroadcastChannel <span class="api-version">v0.9+</span> - -`BroadcastChannel` API æ¯ Weex å®ä¾é´éä¿¡ç解å³æ¹æ¡ã - -### åè - -+ [BroadcastChannel specification](https://html.spec.whatwg.org/multipage/comms.html#broadcasting-to-other-browsing-contexts). -+ [MessageEvent specification](https://html.spec.whatwg.org/multipage/comms.html#messageevent) - -### API - -+ `postMessage(message)`: éè¿æ¶æ¯ééåéç¹å®æ¶æ¯ç»å ¶ä» BroadcastChannel 对象ã -+ `close`: å ³é BroadcastChannel 对象ï¼ä»¥ä¾¿åå¾åæ¶ã -+ `onmessage`: Event å¤çå½æ°, å½ BroadcastChannel 对象æ¥æ¶å°æ¶æ¯æ¶è§¦åã - -### ä½¿ç¨ - -```javascript -const Stack = new BroadcastChannel('Avengers') -Stack.onmessage = function (event) { - console.log(event.data) // in this case, it's "Hulk Smash !!!" -} - -// in another instance -const Hulk = new BroadcastChannel('Avengers') -Hulk.postMessage("Hulk Smash !!!") -``` - -è¿è¡ä»¥ä¸ä»£ç ï¼Stack å¯ä»¥ä» Hulk æ¥æ¶æ¶æ¯ã - -### 注æ - -éè¦æ³¨æçæ¯: ** `message` å¦ææ¯ä¸ä¸ªå¯¹è±¡ï¼è¯¥å¯¹è±¡ä¸ä¼æ·±æ·è´ã** - -åè以ä¸ä¾å - -```javascript -const a = new BroadcastChannel('app') -const b = new BroadcastChannel('app') - -const message = { - lists: ['A', 'B'] -} - -a.onmessage = function (event) { - - // in this case, event.data is a reference of message - console.assert(event.data === message) - -} - -b.postMessage(message) -``` - -å¨è¿ä¸ªä¾åä¸ï¼`event.data` å ¨çäº `message`ã - -ä¸æ·±æ·è´ç¸æ¯ï¼è¿ç§æ¹å¼è½å¤æé«æç并åå°å åæ¶èãä½æ¯ï¼ä¸å»ºè®®å¼åè å¨ä½¿ç¨æ¶ç¼åæä¿®æ¹äºä»¶å¯¹è±¡ (ææç±»åçäºä»¶å¤çç¨åºé½åºè¯¥ææ¤éå¶)ã \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/migration/difference.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/migration/difference.md b/doc/source/cn/references/migration/difference.md deleted file mode 100644 index b11c6c2..0000000 --- a/doc/source/cn/references/migration/difference.md +++ /dev/null @@ -1,249 +0,0 @@ ---- -title: Weex å Vue 2.x çè¯æ³å·®å¼ -type: references -order: 12.2 -version: 2.1 ---- - -# Weex å Vue 2.x çè¯æ³å·®å¼ - -## Overview - - -| | Weex | Vue | -| ---- | ---- | --- | -| çå½å¨æ | `ready: function() {}` | `mounted: function() {}` | -| æ¡ä»¶æ令 | `if="{% raw %}{{!foo}}{% endraw %}"` | `v-if="!foo"` | -| 循ç¯æ令 | `repeat="{% raw %}{{item in list}}{% endraw %}"` | `v-for="item in list"` | -| æ ·å¼ç±»å | `class="btn btn-{% raw %}{{type}}{% endraw %}"` | `:class="['btn', 'btn-' + type]"` | -| å èæ ·å¼ | `style="color:{% raw %}{{textColor}}{% endraw %}"` | `:style="{ color: textColor }"` | -| äºä»¶ç»å® | `onclick="handler"` | `@click="handler"` | -| åçäºä»¶ | `onclick="xxx"` | `@click.native="xxx"` | -| æ°æ®ç»å® | `src="{% raw %}{{rightItemSrc}}{% endraw %}"` | `:src="rightItemSrc"` | -| å 容/槽 | `<content></content>` | `<slot></slot>` | -| æ°æ®åå§å | `data: { value: 'x' }` | `data: function() { return { value: 'x' } }` | -| æ ç¾ ID | `id="xxx"` | `ref="xxx"` | -| è·åèç¹ | `this.$el('xxx')` | `this.$refs.xxx` | - - -## Reference - -See the source code of `weex-vue-migration` for more details: - -+ [template-rewriter](https://github.com/songsiqi/weex-vue-migration/blob/master/src/template-rewriter/rewriter.js) -+ [script-rewriter](https://github.com/songsiqi/weex-vue-migration/blob/master/src/script-rewriter/rewriter.js) - -## LifeCycle Hooks çå½å¨æé©å -| weex | vue | Description | -| --------- | ------------- | ------------------------- | -| init | beforeCreate | ç»ä»¶å®ä¾åå被å建ï¼ç»ä»¶å±æ§å¦data计ç®ä¹å | -| created | created | ç»ä»¶å®ä¾å建å®æï¼å±æ§å·²ç»å®ï¼ä½DOMè¿æªçæ | -| | beforeMount | 模æ¿ç¼è¯/æè½½ä¹å | -| ready | mounted | 模æ¿ç¼è¯/æè½½ä¹å | -| | beforeUpdate | ç»ä»¶æ´æ°ä¹å | -| | updated | ç»ä»¶æ´æ°ä¹å | -| | activated | for`keep-alive`, ç»ä»¶è¢«æ¿æ´»æ¶è°ç¨ | -| | deactivated | for`keep-alive`, ç»ä»¶è¢«ç§»é¤æ¶è°ç¨ | -| | beforeDestroy | ç»ä»¶è¢«éæ¯åè°ç¨ | -| destroyed | destroyed | ç»ä»¶è¢«éæ¯åè°ç¨ | - -# Data Binding æ°æ®ç»å® - -å¨weexä¸ï¼ä½¿ç¨{% raw %}{{â¦}}{% endraw %}å¨`<template>`ä¸ç»å®å¨`<script>`éå®ä¹çæ°æ®ï¼å¨vueä¸ï¼éè¦å¨è¦ç»å®çå±æ§åå `:` ãå¦ä»¥ä¸ç¤ºä¾ã - -* ç±»å - - - weex - - ```html - <div class="btn btn-{{type}}"></div> - ``` - - - vue - - ```html - <div :class="['btn', 'btn-' + type]"></div> - ``` - -* æ ·å¼ç»å® - - * weex - - ```html - <div style="color:{{textColor}}"></div> - ``` - - * vue - - ```html - <div :style="{color: textColor}"></div> - ``` - -# ifæ令 - -* weex - - ```html - <image src="..." if="{{shown}}"></image> - ``` - - or - - ```html - <image src="..." if="shown"></image> - ``` - -* vue - - ```html - <image src="..." v-if="shown"></image> - ``` - -# 循ç¯æ令 - -* weex: repeat - - `$index`ä¸ºç´¢å¼ - - ```html - <div repeat="{{list}}"> - <text>No. {{$index + 1}}</text> - <div> - ``` - - or - - ```html - <div repeat="{{v in list}}"> - <text>No. {{$index + 1}}, {{v.nickname}}</text> - </div> - ``` - - - 对象åæ°çé¡ºåº - - ```html - <div repeat="{{(key, value) in list}}"> - <text>No. {{key + 1}}, {{value.nickname}}</text> - </div> - ``` - - - `track-by` - - ```html - <div repeat="{{item in items}}" track-by="item.id" class="{{gender}}"></div> - ``` - -* vue: v-for - - - 移é¤`$index`ç´¢å¼ - - - 对象åæ°çæ¹åï¼æ¹ä¸º(value, key), ä¸éç¨ç对象è¿ä»£å¨ä¿æä¸è´ - - ```html - <div repeat="{{(value, key) in list}}"> - <text>No. {{key + 1}}, {{value.nickname}}</text> - </div> - ``` - - - `track-by` æ¿æ¢ä¸º`v-bind` - - ```html - <div v-for="item in items" v-bind:key="item.id"> - ``` - -# åå§åæ°æ® - -* weex - - ```javascript - data: { value: 'x' } - ``` - -* vue - - ```javascript - props: { value: { default: 'x' } } - ``` - - å¨ææ°æ® - - ```javascript - data: function () { return { value: 'x' } } - ``` - - -# å´ç»DOMçå®ä¾æ¹æ³ - -* è·åèç¹ - - - weex: `this.$el('xxx')` - - ```html - <template> - <container> - <text id="top">Top</text> - </container> - </template> - <script> - module.exports = { - methods: { - toTop: function () { - var top = this.$el('top') - } - } - } - </script> - ``` - - - vue - - ```javascript - this.$refs.xxx - ``` - - â - -# äºä»¶ -* äºä»¶ç»å® - - weex - - ```html - <div onclick="handler"></div> - ``` - - - vue - - ```html - <div @click="handler"></div> - ``` - -* äºä»¶è§¦å - - weex: dispatchåbroadcast - - ```javascript - this.$dispatch() - ``` - - ```javascript - this.$broadcast() - ``` - - - vue: emit - - ```javascript - this.$emit() - ``` - - > 注ï¼Weex ç `$dispatch` ä¸ç»ä»¶æ å ³ï¼å¨ä»»æç»ä»¶ä¸é½å¯ä»¥éè¿ `$on` æè·å°ï¼Vue ç`$emit` ç¨äºè§¦åç»ä»¶(æ ç¾)çèªå®ä¹äºä»¶ã - -* åçäºä»¶ - - weex - - ```javascript - onclick="xxx" - ``` - - - vue - - ```javascript - @click.native="xxx" - ``` http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/migration/index.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/migration/index.md b/doc/source/cn/references/migration/index.md deleted file mode 100644 index 1238936..0000000 --- a/doc/source/cn/references/migration/index.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: è¿ç§» -type: references -order: 12 -version: 2.1 ---- - -# è¿ç§» - -- [å¦ä½å°åæ Weex 项ç®æ¹é æ Vue çæ¬](./migration-from-weex.html) -- [Weex å Vue 2.x çè¯æ³å·®å¼](./difference.html) \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/migration/migration-from-weex.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/migration/migration-from-weex.md b/doc/source/cn/references/migration/migration-from-weex.md deleted file mode 100644 index 34c3c6d..0000000 --- a/doc/source/cn/references/migration/migration-from-weex.md +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: å¦ä½å°åæ Weex 项ç®æ¹é æ Vue çæ¬ -type: references -order: 12.1 -version: 2.1 ---- - -# å¦ä½å°åæ Weex 项ç®æ¹é æ Vue çæ¬ - -Weex æ¬èº«æä¸å¥è¯æ³è§åï¼å Vue æ¬èº«å¾ç¸ä¼¼ï¼ç°å¨ Weex ä¸ Vue æäºå®æ¹åä½ï¼æ¯æå° Vue 2.x ä½ä¸ºå ç½®çå端æ¡æ¶ï¼æ们ä¹æ¨èå¤§å®¶ä½¿ç¨ Vue 2.x çè¯æ³å¼ååçåºç¨ã对äºç°åæ§çç `.we` æ件ï¼å»ºè®®å¤§å®¶å°å ¶æ¹é æ Vue çæ¬ã - -## è¦è§£å³çé®é¢ - -> å°å æ ¸åæ¢æ Vue ä¹åï¼åå åºäº Weex è¯æ³å¼åç项ç®å°å¦ä½è¿æ¸¡å° Vue ï¼ - -é¦å éè¦æç¡®ä¸ç¹ï¼Weex åæçå端æ¡æ¶ä¹ä¼ç»§ç»åå¨äº WeexSDK ä¸ï¼ä¾ç¶æ¯æ `.we` æä»¶æ ¼å¼çåæ³ã - -æ¤å¤ï¼ç±äº `.we` å `.vue` æ件çæ ¼å¼æ¬èº«å°±æ¯è¾æ¥è¿ï¼æ以è¿ç§»ææ¬æ¯è¾å°ï¼å»ºè®®å¤§å®¶å°ç°æ `.we` æ ¼å¼çæ件é½è½¬æ¢æ `.vue` æ ¼å¼ãæ们ä¹æ¨åºäºç¸åºçå·¥å ·åæ¹æ³è¾ å©è¿ç§»ï¼å¨å é¨ä¹æ大éçæåå®è·µï¼ä¸è¾¹å°éç¹ä»ç»ä¸ä¸å° `.we` æ件转æ `.vue` æ件çæ¹æ³ã - -## 第ä¸æ¥ï¼åå©å·¥å ·å®ç°è¯æ³è½¬æ¢ - -é¦å ä»ç»ä¸ä¸ªå·¥å ·ï¼ **[weex-vue-migration](https://github.com/songsiqi/weex-vue-migration)** ï¼å®å¯ä»¥èªå¨å° `.we` æ件转为 `.vue` æ件ï¼ç»å¤§å¤æ°ç模æ¿è¯æ³é½è½èªå¨è½¬æ¢ï¼è¯æ³å·®å¼å¦ä¸ï¼ - -| | Weex | Vue | -| ---- | ---- | --- | -| çå½å¨æ | `ready: function() {}` | `mounted: function() {}` | -| æ¡ä»¶æ令 | `if="{% raw %}{{!foo}}{% endraw %}"` | `v-if="!foo"` | -| 循ç¯æ令 | `repeat="{% raw %}{{item in list}}{% endraw %}"` | `v-for="item in list"` | -| æ ·å¼ç±»å | `class="btn btn-{% raw %}{{type}}{% endraw %}"` | `:class="['btn', 'btn-' + type]"` | -| å èæ ·å¼ | `style="color:{% raw %}{{textColor}}{% endraw %}"` | `:style="{ color: textColor }"` | -| äºä»¶ç»å® | `onclick="handler"` | `@click="handler"` | -| åçäºä»¶ | `onclick="xxx"` | `@click.native="xxx"` | -| æ°æ®ç»å® | `src="{% raw %}{{rightItemSrc}}{% endraw %}"` | `:src="rightItemSrc"` | -| å 容/槽 | `<content></content>` | `<slot></slot>` | -| æ°æ®åå§å | `data: { value: 'x' }` | `data: function() { return { value: 'x' } }` | -| æ ç¾ ID | `id="xxx"` | `ref="xxx"` | -| è·åèç¹ | `this.$el('xxx')` | `this.$refs.xxx` | - -æ³è¦äºè§£æ´å¤è¯æ³å·®å¼çç»èï¼å¯ä»¥åèè¿ç¯æç« ï¼[ãWeex å Vue 2.x çè¯æ³å·®å¼ã](./difference.html) ã - -### 使ç¨æ¹æ³ - -é¦å å®è£ å·¥å ·ï¼ - -```bash -npm install weex-vue-migration -g -``` - -转æ¢æä»¶ï¼ - -```bash -weex-vue-migrate demo.we -``` - -转æ¢æååï¼å°ä¼å¨å½åç®å½ä¸çæ `demo.vue` æ件ï¼æ§å¶å°å°ä¼æå¦ä¸è¾åºï¼ - -``` -[Success]: Migrate demo.we => demo.vue in 33ms -Migration finished in 0.035s -``` - -é¤äºéä¸ªè½¬æ¢ `.we` æ件以å¤ï¼`weex-vue-migration` è¿æ¯ææ¹é转æ¢æ´ä¸ªç®å½ï¼åèå ¶[说æææ¡£](https://github.com/songsiqi/weex-vue-migration/blob/master/README.md)å¯ä»¥äºè§£æ´è¯¦ç»ç使ç¨æ¹æ³ã - -### 注æäºé¡¹ - -转æ¢å·¥å ·å°ä¸åæ¯æ Weex ä¸åºå¼çè¯æ³ï¼å¦æ代ç ä¸æå¦ä¸åæ³ï¼å»ºè®®å æå¨ä¿®æ¹åå转æ¢ã - -0. å¿½ç¥ `require('@weex-components')` è¯å¥ï¼å¯ä»¥éè¿ npm å çæ¹å¼å¼å ¥å¤é¨ç»ä»¶ã -0. æ æ³è½¬æ¢ `repeat="list"` åæ³ï¼ä» æ¯æ `repeat="item in list"` æ ¼å¼ã -0. ä¸æ¯æè½¬æ¢ `<script type="config"></script>`ï¼ç®å Vue ä¸ä¸æ¯æåæçé级é ç½®ã - -## 第äºæ¥ï¼æå¨è°æ´ä»£ç ç»è - -模æ¿åæ ·å¼ç转æ¢é½å¯ä»¥åå©å·¥å ·è½»æ转æ¢è¿æ¥ï¼`<script>` ä¸åºæ¬çè¯æ³ä¹å¯ä»¥è½¬æ¢ï¼ä½æ¯ç±äº javascript çåæ³æ¯è¾çµæ´»ï¼ä» ä» ä½¿ç¨å·¥å ·å转æ¢ï¼å¹¶ä¸ä¸å®è½å®ç¾è¿æ¸¡ãå·¥å ·åªè½å¤çè¯æ³ä½æ¯ç解ä¸äºä»£ç ä¸çé»è¾ï¼å¨ Weex å Vue çæ¡æ¶ç¹æ§åå¨ä¸äºå·®å¼ï¼æäºå·®å¼è¿æ¯éè¦æå¨ä¿®æ¹æå¯ä»¥çæã - -> æ示ï¼å¨ä»£ç ä¸ä½¿ç¨çâé»ç§æâè¶å¤ï¼é¡¹ç®å°±è¶é¾ä»¥è½¬æ¢ã - -### æ ·å¼åä½ - -å¨ `.we` æ件åæ ·å¼æ¶ï¼å¼åè é常é½ä¸åé¿åº¦åä½ï¼é»è®¤ä¼è¢«è§ä¸º `px`ãå¨æ°ç Vue çæ¬ç Web 渲æå¨ä¸ï¼`<style>` ä¸çæ ·å¼å°ä¼ç´æ¥è½¬åæ CSS classï¼å¦æä¸ååä½ãæµè§å¨å°æ æ³æ£ç¡®è¯å«ï¼ä¼å¯¼è´å¨ Web 端æ æ³æ£å¸¸æ¸²æãNative ç¯å¢ä¸ä¸åå½±åã - -尽管ä¸å½±å Native 页é¢ç渲æï¼ä¹å»ºè®®ç»æ ·å¼é¿åº¦å ä¸åä½ `px`ã - -### æ§æ¡æ¶ä¸çå ç½®å±æ§ - -+ `vm._app` - + `vm._app.differ` - + `vm._app.doc` - + `vm._app.updateActions()` - -### äºä»¶æ´¾åæºå¶ - -+ `$dispatch` ã`$broadcast` ã`$call` æ¹æ³å·²ç»åºå¼ã -+ `$emit` è¡ä¸ºä¸ä¸è´ã - -å¯ä»¥ä½¿ç¨ Vuex 管çæ°æ®ç¶æã - -### ç´æ¥æä½ Virtual-DOM - -Weex å Vue ä¸ç Virtual-DOM æ ¼å¼å¹¶ä¸ç¸åï¼å¦æä½ ä½¿ç¨äº `this.$el('id')` è·åäºæ个ç»ä»¶ç element ä¹åï¼åä¿®æ¹äºå ¶ä¸çæäºå±æ§æè è°ç¨äºæäºæ¹æ³ï¼è¿äºæä½å¨ Vue ä¸å¾é¾æ¾å°ç´æ¥ç对åºåæ³ã - -ä»å¦ä¸ä¸ªè§åº¦è®²ï¼æ们ä¹é常ä¸å»ºè®®å¨ Weex æ Vue 项ç®ä¸ç´æ¥æä½ Virtual-DOMï¼è¿äºåæ³é½åºè¯¥ä¿®æ¹ã - -## è°æ´å¼åç¯å¢åå·¥å · - -å¨æ件转æ¢å®æåï¼è¿éè¦éæ°è°æ´ä¸ä¸å¼åç¯å¢ã - -### æ件çç¼è¯ - -`weex-loader` åæ¶æ¯æç¼è¯ `.we` å `.vue` æ件ï¼å¦æä½ ä½¿ç¨çæ¯ `webpack` æ¥é ç½®ç¼è¯ç¯å¢ï¼å°ä¸éè¦åä»»ä½æ¹åå°±è½ç´æ¥ç¼è¯ `.vue` æ件ã - -éè¦æ³¨æçæ¯ï¼Vue æ¬èº«å°±æ¯ä¸ä¸ªç¬ç«çå端æ¡æ¶ï¼ä½¿ç¨ Vue ç¼åç项ç®å¨ Web ä¸å®å ¨å¯ä»¥ä¸ä¾èµ Weex 容å¨è¿è¡ãå¨è¿ç§æ åµä¸ï¼éè¦é ç½®åºäº `vue-loader` çç¼è¯èæ¬çæéç¨äº Web å¹³å° js æ件ï¼ç¶åå¼å ¥ Vue æ ¼å¼ç Weex ç»ä»¶åºå°±å¯ä»¥å¨ Web ä¸ã - -### è¾ å©å·¥å · - -Weex æä¾äº [weex-toolkit](https://github.com/weexteam/weex-toolkit) çèææ¶å·¥å ·æ¥è¾ å©å¼ååè°è¯ã[weex-pack](https://github.com/weexteam/weex-pack) å®ç°æå åçåºç¨ï¼åæ ·å¨ Vue ä¸ä¹æ [vue-cli](https://github.com/vuejs/vue-cli) èææ¶å·¥å ·ãWeex å Vue çå·¥å ·äºç¸åäºéé ï¼å»ºè®®å¨å建项ç®åå¼å Vue 项ç®çæ¶åä½¿ç¨ `vue-cli` ï¼å¨è°è¯æ¶ä½¿ç¨ `weex-toolkit`ï¼å¨æå åçåºç¨æ¶ä½¿ç¨ `weex-pack` ã http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/animation.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/animation.md b/doc/source/cn/references/modules/animation.md deleted file mode 100644 index c4381f1..0000000 --- a/doc/source/cn/references/modules/animation.md +++ /dev/null @@ -1,100 +0,0 @@ ---- -title: animation -type: references -order: 3.1 -version: 2.1 ---- - -# `animation` å¨ç» - -æµç ä¸ææä¹çå¨ç»æ¯ä¸ä¸ªååææçæå移å¨åºç¨ç¨æ·ä½éªçæ段ï¼`animation` 模å被ç¨äºå¨ç»ä»¶ä¸æ§è¡å¨ç»ãå¨ç»å¯ä»¥å¯¹ç»ä»¶æ§è¡ä¸ç³»åç®åçåæ¢ (ä½ç½®ã大å°ãæ转è§åº¦ãèæ¯é¢è²åä¸éæ度)ã举个ä¾åï¼å¦ææä¸ä¸ª `<image>` ç»ä»¶ï¼éè¿å¨ç»ä½ å¯ä»¥å¯¹å ¶è¿è¡ç§»å¨ãæ转ãæ伸ææ¶ç¼©çå¨ä½ã - -## API - -### `transition(el, options, callback)` - -#### åæ° - -* `el {Element}`ï¼å°è¦æ§è¡å¨ç»çå ç´ ï¼ä¾å¦æå®å¨ç»çå ç´ `ref` å±æ§ä¸º `test` , å¯ä»¥éè¿è°ç¨ `this.refs.test` æ¥è·åå ç´ çå¼ç¨ã -* `options {Object}`ï¼æè¿°å¨ç»è¿ç¨ç对象ã - * `options.duration {number}`ï¼æå®å¨ç»çæç»æ¶é´ (åä½æ¯æ¯«ç§)ï¼é»è®¤å¼æ¯ `0`ï¼è¡¨ç¤ºæ²¡æå¨ç»ææã - * `options.delay {number}`ï¼æå®è¯·æ±å¨ç»æä½å°æ§è¡å¨ç»ä¹é´çæ¶é´é´é (åä½æ¯æ¯«ç§)ï¼é»è®¤å¼æ¯ `0`ï¼è¡¨ç¤ºæ²¡æ延è¿ï¼å¨è¯·æ±åç«å³æ§è¡å¨ç»ã - * `options.needLayout {boolean}`ï¼èç¹å¨ç»æ§è¡æ¶æ¯å¦äº§çå¸å±å¨ç»å³LayoutAnimationï¼é»è®¤å¼æ¯falseã - * `options.timingFunction {string}`ï¼æè¿°å¨ç»æ§è¡çé度æ²çº¿ï¼ç¨äºä½¿å¨ç»ååæ´ä¸ºå¹³æ»ãé»è®¤å¼æ¯ `linear`ï¼è¡¨ç¤ºå¨ç»ä»å¼å§å°ç»æé½æ¥æåæ ·çé度ãä¸è¡¨ååºäºææåæ³çå±æ§ï¼ - -| å±æ§å | æè¿° | -| ------------------------------ | ---------------------------------------- | -| `linear` | å¨ç»ä»å¤´å°å°¾çé度æ¯ç¸åç | -| `ease-in` | å¨ç»é度ç±æ ¢å°å¿« | -| `ease-out` | å¨ç»é度ç±å¿«å°æ ¢ | -| `ease-in-out` | å¨ç»å å éå°è¾¾ä¸é´ç¹ååéå°è¾¾ç»ç¹ | -| `cubic-bezier(x1, y1, x2, y2)` | å¨ä¸æ¬¡è´å¡å°å½æ°ä¸å®ä¹ååè¿ç¨ï¼å½æ°çåæ°å¼å¿ é¡»å¤äº 0 å° 1 ä¹é´ãæ´å¤å ³äºä¸æ¬¡è´å¡å°çä¿¡æ¯è¯·åé [cubic-bezier](http://cubic-bezier.com/) å [Bézier curve](https://en.wikipedia.org/wiki/B%C3%A9zier_curve). | - -* `options.styles {Object}`ï¼è®¾ç½®ä¸åæ ·å¼è¿æ¸¡ææçé®å¼å¯¹ï¼ä¸è¡¨ååºäºææåæ³çåæ°ï¼ - -| åæ°å | æè¿° | å¼ç±»å | é»è®¤å¼ | -| --------------- | ---------------------------------------- | --------------- | --------------- | -| width | å¨ç»æ§è¡ååºç¨å°ç»ä»¶ä¸çå®½åº¦å¼ | length | æ | -| height | å¨ç»æ§è¡ååºç¨å°ç»ä»¶ä¸çé«åº¦å¼ | length | æ | -| backgroundColor | å¨ç»æ§è¡ååºç¨å°ç»ä»¶ä¸çèæ¯é¢è² | string | none | -| opacity | å¨ç»æ§è¡ååºç¨å°ç»ä»¶ä¸çä¸éæåº¦å¼ | ä»äº 0 å° 1 é´çæ°å¼ | `1` | -| transformOrigin | å®ä¹ååè¿ç¨çä¸å¿ç¹. åæ° `x-aris` å¯è½çå¼ä¸º `left`ã`center`ã`right`ãé¿åº¦å¼æç¾åæ¯å¼, åæ° `y-axis` å¯è½çå¼ä¸º `top`ã`center`ã`bottom`ãé¿åº¦å¼æç¾åæ¯å¼ | `x-axis y-axis` | `center center` | -| transform | å®ä¹åºç¨å¨å ç´ ä¸çåæ¢ç±»åï¼æ¯æä¸è¡¨ååºçå±æ§ | object | æ | - -`transform`å±æ§çåæ³å¼: - -| å称 | æè¿° | å¼ç±»å | é»è®¤å¼ | -| ------------------------------------- | ---------------- | ------- | ---- | -| `translate`/`translateX`/`translateY` | æå®å ç´ è¦ç§»å¨å°çä½ç½® | åç´ å¼æç¾åæ¯ | æ | -| `rotate` | æå®å ç´ å°è¢«æ转çè§åº¦ï¼åä½æ¯åº¦ | number | æ | -| `scale`/`scaleX`/`scaleY` | ææ¯ä¾æ¾å¤§æ缩å°å ç´ | number | æ | -| `rotate`/`rotateX` <span class="api-version">v0.14+</span> /`rotateY` <span class="api-version">v0.14+</span> | æå®å ç´ å°è¢«æ转çè§åº¦ï¼åä½æ¯åº¦ | number | æ | -| `perspective` <span class="api-version">v0.16+</span> | è§å¯è è·ç¦»z=0å¹³é¢çè·ç¦»ï¼å¨Android 4.1å以ä¸ææ | number | æ£æ ç©· - -* `callback {Function}`ï¼å¨ç»æ§è¡å®æ¯ä¹åçåè°å½æ°ã**注æï¼å¨0.16.0+çæ¬åï¼iOSä¸å¯ä»¥è·åanimationæ¯å¦æ§è¡æåçä¿¡æ¯ï¼callbackä¸ç`result`åæ°ä¼æ两ç§ï¼åå«æ¯æ¯`Success`ä¸`Fail`ï¼Androidæä¸æ¯æã** - -## Example - -```html -<template> - <div class="wrapper"> - <div ref="test" @click="move" class="box"></div> - </div> -</template> - -<script> - const animation = weex.requireModule('animation') - const modal = weex.requireModule('modal') - - export default { - methods: { - move () { - var testEl = this.$refs.test; - animation.transition(testEl, { - styles: { - color: '#FF0000', - transform: 'translate(250px, 100px)', - transformOrigin: 'center center' - }, - duration: 800, //ms - timingFunction: 'ease', - needLayout:false, - delay: 0 //ms - }, function () { - modal.toast({ message: 'animation finished.' }) - }) - } - } - } -</script> - -<style scoped> - .box { - width: 250px; - height: 250px; - background-color: #DDD; - } -</style> -``` - -[try it](http://dotwe.org/vue/2d1b61bef061448c1a5a13eac9624410) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/clipboard.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/clipboard.md b/doc/source/cn/references/modules/clipboard.md deleted file mode 100644 index 300340c..0000000 --- a/doc/source/cn/references/modules/clipboard.md +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: clipboard -type: references -order: 3.2 -version: 2.1 ---- - -# `clipboard` åªåæ¿ - -<span class="weex-version">v0.8+</span> - -æ们å¯ä»¥éè¿ `clipboard` 模åç `getString()`ã`setString()` æ¥å£ä»ç³»ç»çç²è´´æ¿è·åå 容æè 设置å 容ã - -以åå½æ们æ¶å°ä¸æ¡çä¿¡éªè¯ç ä¿¡æ¯æ¶ï¼é¤äºäººèæ·è´ï¼æ们æ æ³è·åæ·è´çä¿¡çå 容ãè¿æ¯é常è¦æ¼çãä½æ¯ç°å¨æ们å¯ä»¥éè¿ç®åçè°ç¨ `clipboard.getString()` æ¥å£æ¥è·åçä¿¡å 容äºã - -**注æ** - -* ä» æ¯æææ¬æ·è´ -* åºäºå®å ¨èèåå¹³å°éå¶ï¼åªæ¯æ Android å iOSï¼ä¸æ¯æ html5ã - -## API - -### `getString(callback)` - -ä»ç³»ç»ç²è´´æ¿è¯»åå 容ã - -#### åæ° - -* `callback {function (ret)}`ï¼æ§è¡å®è¯»åæä½åçåè°å½æ°ã`ret {Object}` 为 `callback` å½æ°çåæ°ï¼æ两个å±æ§ï¼ - - `ret.data`ï¼è·åå°çææ¬å å®¹ï¼ - - `ret.result`ï¼è¿åç¶æï¼å¯è½ä¸º `success` æ `fail`ã - -### `setString(text)` - -å°ä¸æ®µææ¬å¤å¶å°åªåæ¿ï¼ç¸å½äºæå¨å¤å¶ææ¬ã - -#### åæ° - -* `text {string}`ï¼è¦å¤å¶å°åªåæ¿çå符串ã - -### Example - -```html -<template> - <div> - <div class="div"> - <text class="text" @click="onItemClick">{{message}}</text> - </div> - <div class="div"> - <text class="text" @click="setContent">Click to copy: {{tobecopied}}</text> - </div> - </div> -</template> - -<script> - const clipboard = weex.requireModule('clipboard') - - export default { - data () { - return { - tobecopied: 'yay!', - message: 'nothing.' - } - }, - - methods: { - setContent () { - clipboard.setString(this.tobecopied) - }, - onItemClick () { - this.message = 'clicked! ' - clipboard.getString(ret => { - this.message = 'text from clipboard:' + ret.data - }) - } - } - } -</script> - -<style scoped> - .div { - flex-direction: row; - justify-content: space-between; - align-items: center; - width: 750px; - height: 90px; - padding-left: 30px; - padding-right: 30px; - - border-bottom-width: 1px; - border-style: solid; - border-color: #DDDDDD; - } - .text { - width: 750px; - height: 90px; - } -</style> -``` - -[try it](http://dotwe.org/vue/126d3cfc5533393e28943978b07aa5c1) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/dom.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/dom.md b/doc/source/cn/references/modules/dom.md deleted file mode 100644 index a177929..0000000 --- a/doc/source/cn/references/modules/dom.md +++ /dev/null @@ -1,281 +0,0 @@ ---- -title: dom -type: references -order: 3.3 -version: 2.1 ---- - -# dom - -å å«å¦ä¸å¯ä»¥æ´æ° dom æ ç dom APIã - -è¿é¨åAPIæ¯éè¿æ virtual-dom çæ¶æ¯åéå° native 渲æå¨æ¥åå°çã - -å¼åè å¨æ¥å¸¸å¼åä¸ï¼å¯ä¸å¯å¨ `.vue` æ件ä¸ä½¿ç¨çæ¯ `scrollToElement`ã -~~ä½ ä¹å¯ä»¥è°ç¨ `$scrollTo` æ¹æ³æ¥ä½¿ç¨å®~~ - -è¿ä¸ªé¡µé¢æåçå ¶ä»ç APIï¼åªå¨ `callNative` è¿ç¨ä¸ç native 渲æå¨ç¨ã -ï¼å ³äº `callNative` è¿ç¨çè¿ä¸æ¥ä»ç»ï¼å¯ä»¥å¨ [How it works](../../advanced/how-it-works.html)ä¸ç JS Framework é¨åçå° ï¼ - -## API -### scrollToElement(node, options) - -让页é¢æ»å¨å°é£ä¸ªå¯¹åºçèç¹ï¼è¿ä¸ªAPIåªè½å¨ `<scroller>` å `<list>` ç»ä»¶ä¸ç¨ã - -~~è¿ä¸ªAPIä¹è½éè¿è°ç¨VMçæ¹æ³ `$scrollTo` æ¥ä½¿ç¨ï¼å·²å¼ç¨ï¼~~ - -è¦å¨ä½ ç `.vue` æ件ä¸ä½¿ç¨è¿ä¸ª APIï¼å¯ä»¥ä½¿ç¨ `weex.requireModule('dom').scrollToElement`ã - -#### åæ° -- `node {Node}`ï¼ä½ è¦æ»å¨å°çé£ä¸ªèç¹ -- `options {Object}`ï¼å¦ä¸é项 -- `offset {number}`ï¼ä¸ä¸ªå°å ¶å¯è§ä½ç½®çå移è·ç¦»ï¼é»è®¤æ¯ `0` -- `animated {boolean}` <sup class="wx-v">0.10+</sup>ï¼æ¯å¦éè¦é带æ»å¨å¨ç»ï¼é»è®¤æ¯`true` - -#### ç¤ºä¾ - -```html -<template> - <div class="wrapper"> - <scroller class="scroller"> - <div class="row" v-for="(name, index) in rows" :ref="'item'+index"> - <text class="text" :ref="'text'+index">{{name}}</text> - </div> - </scroller> - <div class="group"> - <text @click="goto10" class="button">Go to 10</text> - <text @click="goto20" class="button">Go to 20</text> - </div> - </div> -</template> - -<script> - const dom = weex.requireModule('dom') - - export default { - data () { - return { - rows: [] - } - }, - created () { - for (let i = 0; i < 30; i++) { - this.rows.push('row ' + i) - } - }, - methods: { - goto10 (count) { - const el = this.$refs.item10[0] - dom.scrollToElement(el, {}) - }, - goto20 (count) { - const el = this.$refs.item20[0] - dom.scrollToElement(el, { offset: 0 }) - } - } - } -</script> - -<style scoped> - .scroller { - width: 700px; - height: 700px; - border-width: 3px; - border-style: solid; - border-color: rgb(162, 217, 192); - margin-left: 25px; - } - .row { - height: 100px; - flex-direction: column; - justify-content: center; - padding-left: 30px; - border-bottom-width: 2px; - border-bottom-style: solid; - border-bottom-color: #DDDDDD; - } - .text { - font-size: 45px; - color: #666666; - } - .group { - flex-direction: row; - /*justify-content: space-around;*/ - justify-content: center; - margin-top: 60px; - } - .button { - width: 200px; - padding-top: 20px; - padding-bottom: 20px; - font-size: 40px; - margin-left: 30px; - margin-right: 30px; - text-align: center; - color: #41B883; - border-width: 2px; - border-style: solid; - border-color: rgb(162, 217, 192); - background-color: rgba(162, 217, 192, 0.2); - } -</style> -``` - -[try it](http://dotwe.org/vue/56e0d256cbb26facd958dbd6424f42b2) - -### getComponentRect(ref, callback) <span class="api-version">v0.9.4+</span> - -éè¿æ ç¾ç `ref` è·å¾å ¶å¸å±ä¿¡æ¯ï¼è¿åçä¿¡æ¯å¨ `callBack` ä¸ï¼æ ¼å¼åèå¦ä¸ï¼ - -```json -{ - result: true, - size: { - bottom: 60, - height: 15, - left: 0, - right: 353, - top: 45, - width: 353 - } -} -``` - -å¦ææ³è¦è·åå° Weex 容å¨çå¸å±ä¿¡æ¯ï¼å¯ä»¥æå® `ref='viewport'`ï¼è°ç¨ä¾åå¦ä¸ï¼ - -```html -<template> - <div class="wrapper" style='margin-top:200px'> - <div ref="box" class="box"> - <text class="info">Width: {{size.width}}</text> - <text class="info">Height: {{size.height}}</text> - <text class="info">Top: {{size.top}}</text> - <text class="info">Bottom: {{size.bottom}}</text> - <text class="info">Left: {{size.left}}</text> - <text class="info">Right: {{size.right}}</text> - </div> - - <text class="info btn" @click='click()'>{{this.tip}}</text> - - </div> -</template> - -<script> - const dom = weex.requireModule('dom') - - function round(size) { - var roundSize = { - 'width': Math.round(size.width), - 'height': Math.round(size.height), - 'top': Math.round(size.top), - 'bottom': Math.round(size.bottom), - 'left': Math.round(size.left), - 'right': Math.round(size.right) - } - return roundSize - } - - export default { - data () { - return { - size: { - width: 0, - height: 0, - top: 0, - bottom: 0, - left: 0, - right: 0 - }, - ref:"viewport", - tip:"get box rect" - } - }, - mounted () { - const result = dom.getComponentRect(this.ref, option => { - console.log('getComponentRect:', option) - this.size = round.call(this,option.size); - }) - }, - - methods:{ - click:function() { - if (this.ref === 'viewport') { - this.ref = this.$refs.box; - this.tip = "get viewport rect" - } else { - this.ref = 'viewport' - this.tip = "get box rect" - } - - const result = dom.getComponentRect(this.ref, option => { - console.log('getComponentRect:', option) - this.size = round.call(this,option.size); - }) - } - } - - } -</script> - -<style scoped> - .btn { - margin-top:20px; - border-width:2px; - border-style: solid; - border-radius:10px; - width:300px; - margin-left:170px; - padding-left:35px; - border-color: rgb(162, 217, 192); - - } - .btn:active { - background-color: #8fbc8f; - border-color: gray; - } - - .box { - align-items:center; - margin-left: 150px; - width: 350px; - height: 400px; - background-color: #DDD; - border-width: 2px; - border-style: solid; - border-color: rgb(162, 217, 192); - background-color: rgba(162, 217, 192, 0.2); - } - .info { - font-size: 40px; - top:30px; - margin-left:20px; - font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; - color: #41B883; - } -</style> -``` - -[try it](http://dotwe.org/vue/d069a9bf0f0781b914f12a9a7b9a1447) - - -### addRule -`æ¯æçæ¬:v0.12.0` - -addRuleæ¯å¯ä»¥ä¸ºdom æ·»å ä¸æ¡è§åï¼ç®åæ¯æèªå®ä¹åä½fontFaceè§åï¼æ建èªå®ä¹çfont-familyï¼å¯ä»¥å¨[text](../components/text.html#iconfont)ä½¿ç¨ - -#### fontFace - -```html -var domModule = weex.requireModule('dom'); -domModule.addRule('fontFace', { - 'fontFamily': "iconfont2", - 'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')" -}); - -``` - -[try it](http://dotwe.org/vue/95b2c6716f37066d5f44c5c75c979394) - -## å ¶ä» - -dom è¿æä¸äºåºå±æ¥å£ç¨äºå建 Weex å®ä¾æ¶è°ç¨ï¼æ¯å¦ `createBody`ã`updateAttrs` çï¼ä½å¹¶æªå¼æ¾ä¾å¤é¨ä½¿ç¨ã http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/globalevent.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/globalevent.md b/doc/source/cn/references/modules/globalevent.md deleted file mode 100644 index e92a114..0000000 --- a/doc/source/cn/references/modules/globalevent.md +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: globalEvent -type: references -order: 3.9 -version: 2.1 ---- - -# å ¨å±äºä»¶ - -<span class="weex-version">0.8</span> - -`globalEvent` ç¨äºçå¬æä¹ æ§äºä»¶ï¼ä¾å¦å®ä½ä¿¡æ¯ï¼éèºä»ªççååãå ¨å±äºä»¶æ¯éè¦é¢å¤ APIs å¤ççæ¬¡è¦ APIãä½ è½éè¿ `addEventListener` 注åäºä»¶çå¬ï¼å½ä½ ä¸åéè¦çæ¶åï¼ä¹å¯ä»¥éè¿ `removeEventListener` åæ¶äºä»¶çå¬ã - -*æé* - -- è¿æ¯ä¸ä¸ªå®ä¾çº§å«çäºä»¶ï¼èéåºç¨çº§å«ã - -## å¦ä½è®©ä½ ç模åæ¯æå ¨å±äºä»¶ - -API å¼åå®æåï¼å½éè¦åéäºä»¶æ¶ï¼éè¦éè¿ä»¥ä¸æ¹æ³ï¼ - -```javascript -/** - * - * @param eventName eventName - * @param params event params - */ -instance.fireGlobalEventCallback(eventName,params); -``` - -å¦ä½å¨ weex-html5 ç»ä»¶æ模åä¸ååå ¨å±äºä»¶ï¼åªéå¨ææ¡£å ç´ ä¸åæ´¾äºä»¶ï¼ - -```javascript -var evt = new Event('some-type') -evt.data = { foo: 'bar' } -document.dispatchEvent(evt) -``` - -**示ä¾** - -### Android - -```java -Map<String,Object> params=new HashMap<>(); -params.put("key","value"); -mWXSDKInstance.fireGlobalEventCallback("geolocation",params); -``` - -### iOS - -```object-c -[weexInstance fireGlobalEvent:@"geolocation" params:@{@"key":@"value"}]; -``` - -## API - -### `addEventListener(String eventName, String callback)` - -注åå ¨å±äºä»¶ã - -#### åæ° - -- `eventName {string}`ï¼éè¦çå¬çäºä»¶å称ã -- `callback {Function}`ï¼è§¦åäºä»¶åçåè°å½æ°ã - -#### ç¤ºä¾ - -```javascript -var globalEvent = weex.requireModule('globalEvent'); -globalEvent.addEventListener("geolocation", function (e) { - console.log("get geolocation") -}); -``` - -### `removeEventListener(String eventName)` - -åæ¶äºä»¶çå¬ã - -#### åæ° - -- `eventName {string}`ï¼éè¦åæ¶çäºä»¶å称ã - -#### ç¤ºä¾ - -```javascript -var globalEvent = weex.requireModule('globalEvent'); -globalEvent.removeEventListener("geolocation"); -``` http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/index.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/index.md b/doc/source/cn/references/modules/index.md deleted file mode 100644 index 543b9d2..0000000 --- a/doc/source/cn/references/modules/index.md +++ /dev/null @@ -1,21 +0,0 @@ ---- -title: å 建模å -type: references -order: 3 -has_chapter_content: true -version: 2.1 ---- - -# å 建模å - -- [animation](./animation.html) -- [WebSocket](./websocket.html) -- [picker](./picker.html) -- [clipboard](./clipboard.html) -- [dom](./dom.html) -- [modal](./modal.html) -- [navigator](./navigator.html) -- [storage](./storage.html) -- [stream](./stream.html) -- [webview](./webview.html) -- [globalEvent](./globalevent.html) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/meta.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/meta.md b/doc/source/cn/references/modules/meta.md deleted file mode 100644 index a7d667e..0000000 --- a/doc/source/cn/references/modules/meta.md +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: meta -type: references -order: 3.12 -version: 2.1 ---- - -# meta - -meta 模åå¯ç¨äºå£°æå个页é¢çå ä¿¡æ¯ï¼é常æ¯ä¸äºé¡µé¢çé ç½®ï¼å¦å®¹å¨çæ¾ç¤ºå®½åº¦ (viewport) çã - -## API - -### setViewport(options) - -<span class="weex-version">0.10.0+</span> - -Weex 容å¨é»è®¤ç宽度 (viewport) æ¯ 750pxï¼éè¿ setViewport æ¹æ³å¯ä»¥æ¹å页é¢çæ¾ç¤ºå®½åº¦ï¼ä» 对å½å页é¢çæã - -> éè¦æ³¨æçæ¯ï¼**åªæå¨é¡µé¢æ¸²æå¼å§ä¹å设置 viewport æä¼çæã** ä¹å°±æ¯è¯´ï¼setViewport æ¹æ³åªè½å¨å ¥å£æ件ä¸ä½¿ç¨ï¼èä¸è¦å¨ `new Vue(...)` ä¹åè°ç¨ï¼å¦ææ¯å¨ç»ä»¶ä¸ä½¿ç¨ï¼å°±åªæå¨æ¸²æå°è¯¥ç»ä»¶çæ¶åæä¼æ§è¡ç¸åºç代ç ï¼æ¤æ¶é¡µé¢å·²ç»å¤äºæ¸²æè¿ç¨ä¸ï¼è®¾ç½® viewport å°ä¸ä¼åçæã - - -#### åæ° - -åæ°é ç½®åé´äº W3C æ åä¸ç [CSS Device Adaptation](https://drafts.csswg.org/css-device-adapt/#viewport-meta)ï¼ç®åæ¯æå¦ä¸å±æ§ï¼ - -+ `options`: viewport çé 置项 - + `width`: æ°å¼ï¼æè `"device-width"` å `"device-height"` ä¹ä¸ã - + `height`: æ°å¼ï¼æè `"device-width"` å `"device-height"` ä¹ä¸ã - -宽度åé«åº¦çåä½é»è®¤æ¯ `px`ï¼æä¸æ¯æå ¶ä»åä½ã - -#### ä¾å - -å ¥å£æä»¶ï¼ - -```js -// entry.js - -import App from './app.vue' -const meta = weex.requireModule('meta') - -// é ç½® viewport ç宽度为 640px -meta.setViewport({ - width: 640 -}) - -App.el = '#root' -new Vue(App) -``` - -å¨å ¥å£æ件ä¸é ç½®äº viewport ç宽度为 640 ä¹åï¼å½å页é¢ä¸çææç»ä»¶é½ä¼ä»¥ 640px ä½ä¸ºæ»¡å±å®½åº¦ã - -ç»ä»¶æä»¶ï¼ - -```html -<!-- app.vue --> -<template> - <div> - <div class="box750"> - <text class="text">750</text> - <div class="box640"> - <text class="text">640</text> - <div class="box480"> - <text class="text">480</text> - </div> - </div> - </div> - </div> -</template> - -<style scoped> - .box750 { - width: 750px; - height: 750px; - background-color: #EEEEEE; - } - .box640 { - width: 640px; - height: 640px; - background-color: #CCCCCC; - } - .box480 { - width: 480px; - height: 480px; - background-color: #AAAAAA; - } - .text { - font-size: 50px; - } -</style> -``` - -[è¯è¯ç](http://dotwe.org/vue/7d0302fe499ab08afdb12a376c646b59)ãï¼ç±äº http://dotwe.org ç®åè¿ä¸æ¯æé ç½®å ¥å£æ件ï¼ä¾åä¸çææææ¶æ æ³å¨çº¿æ¥çãï¼ - -æ¬å°å¼åç¯å¢çæ建å¯ä»¥åèï¼[ãæ建å¼åç¯å¢ã](../../guide/set-up-env.html)ã http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/modal.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/modal.md b/doc/source/cn/references/modules/modal.md deleted file mode 100644 index 6c42e50..0000000 --- a/doc/source/cn/references/modules/modal.md +++ /dev/null @@ -1,141 +0,0 @@ ---- -title: modal -type: references -order: 3.4 -version: 2.1 ---- - -# `modal` 模æ - -`modal` 模åæä¾äºä»¥ä¸å±ç¤ºæ¶æ¯æ¡ç APIï¼`toast`ã`alert`ã`confirm` å `prompt`ã - -## API - -### `toast(options)` - -`toast()` ä¼å¨ä¸ä¸ªå°æµ®å±éå±ç¤ºå ³äºæ个æä½çç®ååé¦ãä¾å¦ï¼å¨é®ä»¶åéå离å¼é®ç¼ç¼è¾çé¢ï¼å¯ä»¥è§¦åä¸ä¸ªâè稿已ä¿åâç toastï¼åç¥ç¨æ·ä»¥åå¯ä»¥ç»§ç»ç¼è¾ãtoast ä¼å¨æ¾ç¤ºä¸æ®µæ¶é´ä¹åèªå¨æ¶å¤±ã - -#### åæ° - -- `options {Object}`ï¼ç¸å ³é项 - - `message {string}`ï¼å±ç¤ºçå 容 - - `duration {number}`ï¼å±ç¤ºçæç»æ¶é´ï¼ä»¥ç§ä¸ºåä½ï¼ - - Android: å¦ææ¶é´é¿åº¦å¤§äº3sï¼å°ä½¿ç¨ä¸ä¸ªè¢«ç§°ä¸º**LONG**çç³»ç»åé, å¦å使ç¨**SHORT**è¿ä¸ªç³»ç»åé - - iOS: æç»çæ¶é´åDurationç¸åã - -### `alert(options, callback)` - -è¦åæ¡ç»å¸¸ç¨äºç¡®ä¿ç¨æ·å¯ä»¥å¾å°æäºä¿¡æ¯ãå½è¦åæ¡åºç°åï¼ç¨æ·éè¦ç¹å»ç¡®å®æé®æè½ç»§ç»è¿è¡æä½ã - -#### åæ° - -- `options {Object}`ï¼alerté项 - - `message {string}`ï¼è¦åæ¡å æ¾ç¤ºçæåä¿¡æ¯ - - `okTitle {string}`ï¼ç¡®å®æé®ä¸æ¾ç¤ºçæåä¿¡æ¯ï¼é»è®¤æ¯âOKâ - - `callback {Function}`ï¼ç¨æ·æä½å®æåçåè° - -### `confirm(options, callback)` - -确认æ¡ç¨äºä½¿ç¨æ·å¯ä»¥éªè¯æè æ¥åæäºä¿¡æ¯ãå½ç¡®è®¤æ¡åºç°åï¼ç¨æ·éè¦ç¹å»ç¡®å®æè åæ¶æé®æè½ç»§ç»è¿è¡æä½ã - -#### åæ° - -- `options {object}`ï¼confirm é项 - - `message {string}`ï¼ç¡®è®¤æ¡å æ¾ç¤ºçæåä¿¡æ¯ - - `okTitle {string}`ï¼ç¡®è®¤æé®ä¸æ¾ç¤ºçæåä¿¡æ¯ï¼é»è®¤æ¯ `OK` - - `cancelTitle {string}`ï¼åæ¶æé®ä¸æ¾ç¤ºçæåä¿¡æ¯ï¼é»è®¤æ¯ `Cancel` -- `callback {function (result)}`ï¼ç¨æ·æä½å®æåçåè°ï¼åè°å½æ°çåæ° `result` æ¯ç¡®å®æé®ä¸çæåä¿¡æ¯å符串 - -### `prompt(options, callback)` - -æ示æ¡ç»å¸¸ç¨äºæ示ç¨æ·å¨è¿å ¥é¡µé¢åè¾å ¥æ个å¼ãå½æ示æ¡åºç°åï¼ç¨æ·éè¦è¾å ¥æ个å¼ï¼ç¶åç¹å»ç¡®è®¤æåæ¶æé®æè½ç»§ç»æä½ã - -#### åæ° - -- `options {object}`ï¼prompt é项 - - `message {string}`ï¼æ示æ¡å è¦æ¾ç¤ºçæåä¿¡æ¯ - - `okTitle {string}`ï¼ç¡®è®¤æé®ä¸æ¾ç¤ºçæåä¿¡æ¯ï¼é»è®¤æ¯ `OK` - - `cancelTitle {string}`ï¼åæ¶æé®ä¸æ¾ç¤ºçæåä¿¡æ¯ï¼é»è®¤æ¯ `Cancel` -- `callback {function (ret)}`ï¼ç¨æ·æä½å®æåçåè°ï¼åè°å½æ°çåæ° `ret` æ ¼å¼å½¢å¦ `{ result: 'OK', data: 'hello world' }`ï¼å¦ä¸ - - `result {string}`ï¼ç¨æ·æä¸çæé®ä¸çæåä¿¡æ¯ - - `data {string}`ï¼ç¨æ·è¾å ¥çæåä¿¡æ¯ - - -## Example - -```html -<template> - <div class="wrapper"> - <text class="button" @click="showToast">Toast</text> - <text class="button" @click="showAlert">Alert</text> - <text class="button" @click="showConfirm">Confirm</text> - <text class="button" @click="showPrompt">Prompt</text> - </div> -</template> - -<script> - var modal = weex.requireModule('modal') - - export default { - methods: { - showToast (event) { - console.log('will show toast') - modal.toast({ - message: 'This is a toast', - duration: 0.3 - }) - }, - showAlert (event) { - console.log('will show alert') - modal.alert({ - message: 'This is a alert', - duration: 0.3 - }, function (value) { - console.log('alert callback', value) - }) - }, - showConfirm (event) { - console.log('will show confirm') - modal.confirm({ - message: 'Do you confirm ?', - duration: 0.3 - }, function (value) { - console.log('confirm callback', value) - }) - }, - showPrompt (event) { - console.log('will show prompt') - modal.prompt({ - message: 'This is a prompt', - duration: 0.3 - }, function (value) { - console.log('prompt callback', value) - }) - } - } - }; -</script> - -<style scoped> - .wrapper { - flex-direction: column; - justify-content: center; - } - .button { - font-size: 60px; - width: 450px; - text-align: center; - margin-top: 30px; - margin-left: 150px; - padding-top: 20px; - padding-bottom: 20px; - border-width: 2px; - border-style: solid; - color: #666666; - border-color: #DDDDDD; - background-color: #F5F5F5 - } -</style> -``` - -[try it](http://dotwe.org/vue/a7dddfb24edb72be947fc4eec3803f1d) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/navigator.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/navigator.md b/doc/source/cn/references/modules/navigator.md deleted file mode 100644 index fdfa55d..0000000 --- a/doc/source/cn/references/modules/navigator.md +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: navigator -type: references -order: 3.5 -version: 2.1 ---- - -# `navigator` 导èªæ§å¶ - -<span class="weex-version">v0.6.1+</span> - -ä¼æå¨ç¥ï¼å¨æµè§å¨éï¼æ们å¯ä»¥éè¿åè¿æè åéæé®æ¥åæ¢é¡µé¢ï¼iOS/Android ç `navigator` 模åå°±æ¯ç¨æ¥å®ç°ç±»ä¼¼çææçãé¤äºåè¿ãåéåè½ï¼è¯¥æ¨¡åè¿å 许æ们æå®å¨åæ¢é¡µé¢çæ¶åæ¯å¦åºç¨å¨ç»ææã - -## API - -### `push(options, callback)` - -æä¸ä¸ªweex页é¢URLåå ¥å¯¼èªå æ ä¸ï¼å¯æå®å¨é¡µé¢è·³è½¬æ¶æ¯å¦éè¦å¨ç»ï¼ä»¥åæä½å®æåéè¦æ§è¡çåè°å½æ° - -#### åæ° - -* `options {Object}`ï¼é项åæ° - * `url {stirng}`ï¼è¦åå ¥ç Weex 页é¢ç URL - * `animated {string}`ï¼`"true"` 示æ为页é¢åå ¥æ¶éè¦å¨ç»ææï¼`"false"` åä¸éè¦ï¼é»è®¤å¼ä¸º `"true"` -* `callback {Function}`ï¼æ§è¡å®è¯¥æä½åçåè°å½æ° - -### `pop(options, callback)` - -æä¸ä¸ª Weex é¡µé¢ URL å¼¹åºå¯¼èªå æ ä¸ï¼å¯æå®å¨é¡µé¢å¼¹åºæ¶æ¯å¦éè¦å¨ç»ï¼ä»¥åæä½å®æåéè¦æ§è¡çåè°å½æ°ã - -#### åæ° - -* `options {object}`ï¼é项åæ°å¯¹è±¡ - * `animated {string}`ï¼`"true"` 示æ为弹åºé¡µé¢æ¶éè¦å¨ç»ææï¼`"false"` åä¸éè¦ï¼é»è®¤å¼ä¸º `"true"` -* `callback {function}`ï¼æ§è¡å®è¯¥æä½åçåè°å½æ° - - -*注æäºé¡¹ï¼`animated` äºçº§åæ°ç®åä» æ¯æå符串ç `"true"` å `"false"`ï¼ä¼ å ¥å¸å°å¼ç±»åä¼å¯¼è´ç¨åºå´©æºï¼æªæ¥çæ¬ä¼ä¿®å¤è¿ä¸ªé®é¢* - -## Example - -```html -<template> - <div class="wrapper"> - <text class="button" @click="jump">Jump</text> - </div> -</template> - -<script> - var navigator = weex.requireModule('navigator') - var modal = weex.requireModule('modal') - - export default { - methods: { - jump (event) { - console.log('will jump') - navigator.push({ - url: 'http://dotwe.org/raw/dist/519962541fcf6acd911986357ad9c2ed.js', - animated: "true" - }, event => { - modal.toast({ message: 'callback: ' + event }) - }) - } - } - }; -</script> - -<style scoped> - .wrapper { - flex-direction: column; - justify-content: center; - } - .button { - font-size: 60px; - width: 450px; - text-align: center; - margin-top: 30px; - margin-left: 150px; - padding-top: 20px; - padding-bottom: 20px; - border-width: 2px; - border-style: solid; - color: #666666; - border-color: #DDDDDD; - background-color: #F5F5F5 - } -</style> -``` - -[try it](http://dotwe.org/vue/5c670b07735ee6d08de5c8eb93f91f11) http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/modules/picker.md ---------------------------------------------------------------------- diff --git a/doc/source/cn/references/modules/picker.md b/doc/source/cn/references/modules/picker.md deleted file mode 100644 index d1623b0..0000000 --- a/doc/source/cn/references/modules/picker.md +++ /dev/null @@ -1,129 +0,0 @@ ---- -title: picker -type: references -order: 3.11 -version: 2.1 ---- - -# picker - -<span class="weex-version">v0.9+</span> - -## æ¦è¿° - -以ä¸ä¸º picker ç¸å ³ç APIï¼ç¨äºæ°æ®éæ©ï¼æ¥æéæ©ï¼æ¶é´éæ©ãï¼ H5模åå¦é使ç¨ï¼è¯·æå¨å¼å ¥[weex-pickerç»ä»¶](https://github.com/weexteam/weex-picker)ï¼ - -## API -### `pick(options, callback[options])` - -è°ç¨åé picker - -#### åæ° - -- `options {Object}`ï¼è°ç¨åé picker é项 - - `index {number}`ï¼é»è®¤éä¸çé项 - - `items {array}`ï¼picker æ°æ®æº - -- `callback {function (ret)}`ï¼æ§è¡å®è¯»åæä½åçåè°å½æ°ã`ret {Object}` 为 `callback` å½æ°çåæ°ï¼æ两个å±æ§ï¼ - - `result {string}`ï¼ç»æä¸ç§ç±»å `success`, `cancel`, `error` - - `data {number}`ï¼éæ©çé项,ä» æå确认æ¶ååå¨ã - -### `pickDate(options, callback[options])` - -è°ç¨ date picker - -#### åæ° - -- `options {Object}`ï¼è°ç¨ date picker é项 - - `value {string}`ï¼å¿ éï¼date picker éä¸çå¼ï¼date çåç¬¦ä¸²æ ¼å¼ä¸º`yyyy-MM-dd` - - `max {string}`ï¼å¯éï¼date çæå¤§å¼ - - `min {string}`ï¼å¯éï¼date çæå°å¼ - -- `callback {function (ret)}`ï¼æ§è¡å®è¯»åæä½åçåè°å½æ°ã`ret {Object}` 为 `callback` å½æ°çåæ°ï¼æ两个å±æ§ï¼ - - `result {string}`ï¼ç»æä¸ç§ç±»å `success`, `cancel`, `error` - - `data {string}`ï¼éæ©çå¼ date çå符ï¼æ ¼å¼ä¸º `yyyy-MM-dd`, ä» æå确认çæ¶ååå¨ã - -### `pickTime(options, callback[options])` - -è°ç¨ time picker - -#### åæ° - -- `options {Object}`ï¼è°ç¨ time picker é项 - - `value {string}`ï¼å¿ éï¼time æ ¼å¼ä¸º `HH:mm` - -- `callback {function (ret)}`ï¼æ§è¡å®è¯»åæä½åçåè°å½æ°ã`ret {Object}` 为 `callback` å½æ°çåæ°ï¼æ两个å±æ§ï¼ - - `result {string}`ï¼ç»æä¸ç§ç±»å `success`, `cancel`, `error` - - `data {string}`ï¼time æ ¼å¼ä¸º `HH:mm`, ä» æå确认çæ¶ååå¨ã - -## ç¤ºä¾ - -```html -<template> - <div class="wrapper"> - <div class="group"> - <text class="label">Time: </text> - <text class="title">{{value}}</text> - </div> - <div class="group"> - <text class="button" @click="pickTime">Pick Time</text> - </div> - </div> -</template> - -<script> - const picker = weex.requireModule('picker') - - export default { - data () { - return { - value: '' - } - }, - methods: { - pickTime () { - picker.pickTime({ - value: this.value - }, event => { - if (event.result === 'success') { - this.value = event.data - } - }) - } - } - } -</script> - -<style scoped> - .wrapper { - flex-direction: column; - justify-content: center; - } - .group { - flex-direction: row; - justify-content: center; - margin-bottom: 40px; - align-items: center; - } - .label { - font-size: 40px; - color: #888888; - } - .title { - font-size: 80px; - color: #41B883; - } - .button { - font-size: 36px; - width: 280px; - color: #41B883; - text-align: center; - padding-top: 25px; - padding-bottom: 25px; - border-width: 2px; - border-style: solid; - border-color: rgb(162, 217, 192); - background-color: rgba(162, 217, 192, 0.2); - } -</style> -```
