component | attribtues | styles | events | special parent | children |
---|---|---|---|---|---|
<div> | - | box model flexbox position background-color opacity | click appear disappear | - | (any) |
<text> | value | box model flex position background-color opacity color font-size font-style font-weight text-decoration text-align text-overflow line-height | click appear disappear | - | text only |
<image> | src | box model flexbox position background-color opacity resize | click appear disappear | - | (none) |
<scroller> | show-scrollbar scroll-direction | box model flexbox position background-color opacity | click appear disappear | - | (any) |
<list> | loadmoreoffset | box model flexbox position background-color opacity | click appear disappear loadmore refresh loading | - | <cell> <header> <refresh> <loading> |
<cell> | - | box model flexbox position background-color opacity | click appear disappear | <list> | (any) |
<slider> | auto-play | box model flexbox position background-color opacity | click appear disappear change | - | (any)<indicator> |
<indicator> | - | box model flexbox position item-color item-selected-color item-size | click appear disappear | <slider> | (none) |
<wxc-navpage> | height background-color title title-color left-item-title left-item-color right-item-title right-item-color left-item-src right-item-src | box model flexbox position background-color opacity | click appear disappear naviBar.leftItem.click naviBar.rightItem.click | - | (any) |
<wxc-tabbar> | tab-items | box model flexbox position background-color opacity | tabBar.onClick | - | (none) |
<embed> | src | box model flexbox position background-color opacity | click appear disappear | - | (none) |
<web> | src | box model flexbox position background-color opacity | click appear disappear pagestart pagefinish error | - | (none) |
<video> | src play-status auto-play | box model flexbox position background-color opacity | click appear disappear start pause finish fail | - | (none) |
<a> | href | box model flexbox position background-color opacity | click appear disappear | - | (any) |
<input> | type value placeholder disabled autofocus | box model flexbox position background-color opacity placeholder-color color font-size font-style font-weight text-align | click appear disappear | - | (none) |
<switch> | checked disabled | box model flexbox position background-color opacity | appear disappear input change focus blur | - | (none) |
module | apis |
---|---|
@weex-module/dom | scrollToElement(node, { offset }) |
@weex-module/modal | toast({ message, duration }) alert({ message, okTitle }, callback) confirm({ message, okTitle, cancelTitle }, callback(result)) prompt({ message, okTitle, cancelTitle }, callback(result, data)) |
@weex-module/stream | fetch({ method, url, headers, type, body }, callback({ status, ok, statusText, data, headers }), progressCallback({ readyState, status, length, statusText, headers})) |
@weex-module/webview | goBack(ref) goForward(ref) reload(ref) |
@weex-module/navigator | push({ url, animated }, callback) pop({ animated }, callback) |
@weex-module/animation | transition(node, { styles, duration, timingFunction, delay, transform-origin }, callback) |
<foo x="abc">
{% raw %}<foo x="{{expr}}">{% endraw %}
<foo style="name1: value1; name2: value2">
{% raw %}<foo style="name1: value1; name2: {{expr}}; name3: ...">{% endraw %}
<foo class="a b c">
{% raw %}<foo class="a {{expr}} c">{% endraw %}
<foo onclick="methodName">
<foo id="abc">
<foo if="expr">
<foo repeat="item in list">
<foo repeat="(key,item) in list">
<component type="foo">
{% raw %}<component type="{{expr}}">{% endraw %}
this.$vm(el)
this.$el(el)
this.$getConfig()
this.$emit(type, data)
this.$dispatch(type, data)
this.$broadcast(type, data)
data
methods
computed
init
, created
, ready
events
example:
module.exports = { data: function () { return { x: 1, y: 2 } } methods: { foo: function () { console.log('foo') } }, computed: { z: function () { return this.x + this.y } }, events: { custom: function (e) { console.log(e) } }, init: function () {}, created: function () {}, ready: function () {} }