Picker-View ne peut pas défiler ou revient au premier élément après le défilement

Environnement : Uni-app développe un projet H5, et le projet H5 lie la vue Web et l'intègre dans l'application.
Situation : La page du formulaire est divisée en état de lecture seule et état d'édition. Lorsque l'état d'édition est retransféré en lecture. -état seul, l'élément d'activation de la vue du sélecteur est réinitialisé ; suivi Lors du retour à l'état d'édition, la vue du sélecteur est toujours fixée au premier élément et rebondit au premier élément après le défilement. Raison :
Paramétrage manuel l'élément d'activation de la vue du sélecteur sera à l'origine de ce problème. La cause sous-jacente est inconnue et peut être une
solution potentielle à un bug : chaque fois que vous devez définir manuellement l'élément d'activation de la vue du sélecteur, effacez le tableau facultatif et annulez le rendu de l'élément d'activation de la vue du sélecteur. composant. Utilisez setTimeout pour restaurer le tableau facultatif d'origine et le restituer. L'effet est que le composant est restitué à chaque fois qu'il est modifié. , pour éviter le problème de l'impossibilité de faire défiler.

Composant 1.picker-view

<picker-view
    :value="[channelType.activeIndex]"
    @change="pickerViewChange"
    data-field="channelType"
>
    <picker-view-column v-if="channelType.data.length > 0">
        <view v-for="(item, index) in channelType.data" :key="item.value">{
    
    {
    
     item.text }}</view>
    </picker-view-column>
</picker-view>

2. Quittez l'état d'édition

async cancelEdit() {
    
    
    const {
    
     store, channelType } = this;
    let chanelIndex = 0
    let channelData = [].concat(channelType.data)

    if (store.channelType) {
    
    
        // 清空数据使组件不渲染
        chanelIndex = channelType.data.findIndex((t) => t.value === store.channelType);
        channelType.data = []

        if (chanelIndex > -1) {
    
    
            // 使用setTimeout在下个宏任务中再将组件渲染
            setTimeout(()=> {
    
    
                this.setData({
    
    
                    'channelType.data': channelData,
                    'channelType.activeIndex': chanelIndex,
                    'channelType.activeText': channelData[chanelIndex].text
                });
            }, 50)
        }
    } else {
    
    
        // 该表单项无值时也需使组件重新渲染一遍
        channelType.data = []
        setTimeout(() => {
    
    
            this.setData({
    
    
                'channelType.data': channelData,
                'channelType.activeIndex': 0,
                'channelType.activeText': ''
            });
        })
    }


},