[
https://issues.apache.org/jira/browse/WEEX-86?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=16241375#comment-16241375
]
ASF GitHub Bot commented on WEEX-86:
------------------------------------
Github user jondong commented on a diff in the pull request:
https://github.com/apache/incubator-weex-site/pull/7#discussion_r149258647
--- Diff: source/references/components/refresh.md ---
@@ -1,222 +1,141 @@
---
-title: <refresh> & <loading>
+title: <refresh>
type: references
group: Build-in Components
-order: 8.08
+order: 8.09
version: 2.1
---
-# refresh & loading
+# <refresh>
-<span class="weex-version">v0.6.1+</span>
+### <span class="weex-version">v0.6.1+</span>
-## Loading Components
+The `<refresh>` Component provide a pulldown-refresh function for some
special containers, its usage and attributes are similar to the `<loading>`
Component.
+> **Note：** To be rendered properly, the `<refresh>` Component must appear
inside the special Component such as
`<scroller>`、`<list>`、`<hlist>`、`<vlist>`、`<waterfall>`.
-To be rendered properly, the refresh/loading Components must appear inside
the Scroller Component or the List Component.
+ - Simple example :
-### Child Components
+```
+<list>
+ <refresh>
+ ...
+ </refresh>
+ ...
+</list>
+```
+ - Complete example goes
[here](http://dotwe.org/vue/26937c1c74022e79608af118b21bfbc7)
+
+## Child Components
-Any other components, like the text and img components, can be put inside
the refresh component. And there is a special component named loading-indicator
used only inside the refresh or the loading components.
+ - Any other components, like the `<text>` and `<image>` components, can
be put inside the refresh component.
-* loading-indicator is a child component implemented with default
animation effect for the refresh component.
+ - `<loading-indicator>`: There is a special Component named
loading-indicator used only inside the `<refresh>` or the `<loading>`
Components, which implemented with default animation effect for the refresh
component.
-### Attributes
+ - Simple example :
+
+```
+<refresh>
+ <text>Refreshing</text>
+ <loading-indicator></loading-indicator>
+ ...
+</refresh>
+```
+ - Complete example goes
[here](http://dotwe.org/vue/26937c1c74022e79608af118b21bfbc7)
-* display has value of show or hide.
+## Attributes
+ - Support all common attributes, check out [common
attributes](../common/common-attrs)
-### Styles
-common styles: check out [common styles for
components](../common-style.html)
+| Attribute | Type | Value | Default Value |
+| ------------- | ------ | -------------------------- | ------- |
+| `display` | String | show / hide | show |
-### Events
+#### `display`
-* onloading triggered when loading
+ - `show`：If a `<loading-indicator>` Component is included in the
`<refresh>` Component, it will display and start the animation.
+ - `hide`：Collapse the refresh view. If a `<loading-indicator>` Component
is included in the `<refresh>` Component, it will hide and stop the animation.
-#### Restrictions
-* refresh/loading does not support remove action, Weex 0.9 will fix it.
-* refresh/loading despite setting with display='hide', the refresh/loading
view will still appear when scrolling due to known issues. it can be fixed with
a another display='hide' when the refresh/loading should be hidden.
-* refresh/loading can only be hidden or displayed with an attribute
display with value of show or hide. And there should be a statement of
display='hide' when display='show' shows up in an event function, or your
scroller may not response to user inputs.
+> **Note：** The display and hide of `<refresh>` Components can only be
controlled by an attribute named `display` which has the value of show and
hide. A `display="show"` statement is always paired with a `display="hide"`
statement.
--- End diff --
The visibility of refresh component can be controlled by display attribute
with the value `show` and `hide`. A `display="show"` should always be paired
with a `display="hide"` statement.
> Reorganize the structure of documents and website
> -------------------------------------------------
>
> Key: WEEX-86
> URL: https://issues.apache.org/jira/browse/WEEX-86
> Project: Weex
> Issue Type: Improvement
> Components: Project
> Reporter: Hanks Zhang
> Assignee: zhengshihan
>
> h1. Weex Document Index
> + contributing.md
> + development-process.md
> + who-is-using-weex.md
> + releasenote.md
> + resources.md
> h2. Guide
> + index.md
> + advanced
> + app-architecture.md
> + downgrade.md
> + page-architecture.md
> + path.md
> + use-vuex-and-vue-router.md
> + extend-android.md
> + extend-ios.md
> + extend-js-framework.md
> + extend-web-render.md
> + front-end-frameworks.md
> + integrate-devtool-to-android.md
> + integrate-devtool-to-ios.md
> + integrate-to-your-app.md
> + set-up-env.md
> + using-rax.md
> + using-vue.md
> h2. References
> + index.md
> + android-apis.md
> + ios-apis.md
> + js-framework-apis.md
> + js-service.md
> + weex-variable.md
> h3. Components
> + a.md
> + cell.md
> + div.md
> + image.md
> + indicator.md
> + input.md
> + list.md
> + loading.md
> + refresh.md
> + scroller.md
> + slider.md
> + switch.md
> + text.md
> + textarea.md
> + video.md
> + waterfall.md
> + web.md
> h3. Modules
> + animation.md
> + clipboard.md
> + dom.md
> + globalevent.md
> + meta.md
> + modal.md
> + navigator.md
> + picker.md
> + storage.md
> + stream.md
> + websocket.md
> + webview.md
> h2. WiKi
> + color-names.md
> + common-events.md
> + common-styles.md
> + css-units.md
> + design-principles.md
> + event-bubble.md
> + faq.md
> + gestures.md
> + index.md
> + platform-difference.md
> + text-styles.md
> h2. Tools
> + helpers.md
> + index.md
> + market.md
> + toolkit.md
--
This message was sent by Atlassian JIRA
(v6.4.14#64029)
