Cube-uiフレームscroll/slideコンポーネントVueフレームkeep-aliveコンポーネントと組み合わせて遭遇したピットを使用
2209 ワード
1.keep-aliveでキャッシュされたページcube-uiのscroll関連コンポーネントを使用している場合は、activatedメソッドでscrollコンポーネントのrefresh()メソッドを手動で呼び出す必要があります.そうしないと、上下にスクロールできない場合があります.
2.keep-aliveでキャッシュされたページcube-uiのslide関連コンポーネントを使用している場合は、activatedメソッドでslideコンポーネントのrefresh()メソッドを手動で呼び出す必要があります.そうしないと、tabラベル切り替え後にslideがスライドしない場合があります.slideコンポーネントのrefreshResetCurrentプロパティはfalseです(リフレッシュ時にインデックスをリセットするかどうか、falseはリセットしません)
サンプルコードthis.userStatusList=[‘空き中’,‘面接中’,‘休暇中’]
2.keep-aliveでキャッシュされたページcube-uiのslide関連コンポーネントを使用している場合は、activatedメソッドでslideコンポーネントのrefresh()メソッドを手動で呼び出す必要があります.そうしないと、tabラベル切り替え後にslideがスライドしない場合があります.slideコンポーネントのrefreshResetCurrentプロパティはfalseです(リフレッシュ時にインデックスをリセットするかどうか、falseはリセットしません)
サンプルコードthis.userStatusList=[‘空き中’,‘面接中’,‘休暇中’]
activated () {
// keep-alive cube-ui scroll , activated scroll refresh() ,
for (let i = 0; i < this.userStatusList.length; i++) {
let scrollStr = 'scroll_' + i.toString()
if (this.$refs[scrollStr]) {
this.$refs[scrollStr].refresh()
}
}
// keep-alive cube-ui slide , activated slide refresh() , tab slide 。slide refreshResetCurrent false( ,false )
this.$refs.slide.refresh();
if (this.scrollHeight < 0) {
this.scrollHeight = this.scrollHeight + 30
}
//
for (let i = 0; i < this.userStatusList.length; i++) {
if (this.selectedLabel === this.userStatusList[i]) {
let scrollStr = 'scroll_' + i.toString()
this.$refs[scrollStr].scrollTo(0, this.scrollHeight)
}
}
},
deactivated (to, from, next) {
try {
//
// , , scroll/slide observeDOM false
// webview , , activated
for (let i = 0; i < this.userStatusList.length; i++) {
if (this.selectedLabel === this.userStatusList[i]) {
let heightStr = ''
let scrollStr = 'scroll_' + i.toString()
if (this.$refs[scrollStr]) {
heightStr = this.$refs[scrollStr].pullDownStyle ? this.$refs[scrollStr].pullDownStyle : '0'
}
heightStr = heightStr.replace('top:', '')
heightStr = heightStr.replace('px', '')
heightStr = parseFloat(heightStr)
this.scrollHeight = heightStr
}
}
} catch (e) {
}
}