1.获取图片大小src=”https://gw.alicdn.com/tfs/TB1788ygMMPMeJjy1XdXXasrXXa-1919-1520.jpg“ />
resize (event) {
if (event.success) {
this.loading = false
const ratio = event.size.naturalHeight / event.size.naturalWidth
const width = Math.min(event.size.naturalWidth, 60)
const height = Math.min(width * ratio, 120)
this.width = width + ‘px’
this.height = height + ‘px’
}
}
2.富交互
http://dotwe.org/vue/8cf4beabb1ff04ba6f9215ce1ccf420a
3.支持css类拼接的形式
onrefresh (event) {
this.refreshing = true
this.refreshText = “loading…”
setTimeout(() => {
this.refreshing = false
this.refreshText = ‘↓ pull to refresh…’
}, 2000)
},
onpullingdown (event) {
// console.log(`${event.pullingDistance}`)
if (event.pullingDistance < -64) {
this.refreshText = '↑ release to refresh...'
} else {
this.refreshText = '↓ pull to refresh...'
}
}
7.背景色渐变实现
.bg {
background-image: linear-gradient(to bottom, #F35BB6, #7B79F9);
}
8.recycle-list使用场景
需要显示item模板不同的列表
9.瀑布流使用
10、addRule(type, contentObject) v0.12.0+(添加字体)
支持版本: >=0.12.0
addRule是可以为dom 添加一条规则,目前支持自定义字体fontFace规则,构建自定义的font-family,可以在text使用
fontFace
const domModule = weex.requireModule(‘dom’)domModule.addRule(‘fontFace’, {‘fontFamily’: “iconfont2”,’src’: “url(‘http://at.alicdn.com/t/font_1469606063_76593.ttf‘)”;})
11、scrollToElement(ref, options)(滚动到某层,比如有滑动效果的日期选择等)
让页面滚动到 ref 对应的组件,这个 API 只能用于可滚动组件的子节点,例如 , 等可滚动组件中。
要在你的 .vue 文件中使用这个 API,可以使用 weex.requireModule(‘dom’).scrollToElement。
参数
ref {Node}:你要滚动到的那个节点
options {Object}:
offset {number}: 一个到其可见位置的偏移距离,默认是 0
animated {boolean} 0.10+:是否需要附带滚动动画,默认是true