uniapp微信小程序遇到scroll-into-view不生效的问题

简单做个记录

正常按照uni官方文档配置就好，之前项目也做过类似需求，但是前两天遇到了设置不生效的问题。

一、想到的几个可能情况：

1、scroll-view 没有高度。

        方式1：初始高度设置为0 通过flex: 1 1auto;填充满剩余高度

<scroll-view :scroll-y="true" style="height: 0" :scroll-into-view="defaultId" class="match-list border-box u-flex-fill u-flex-column">
    <view>something</view>
</scroll-view>

         方式2：本地项目使用的方式，页面创建完成获取父元素高度减去固定的比如输入框等元素高度来设置scroll-view的高度(第一版)

// template
<scroll-view class="im-message-list" id="refMsgList" scroll-y="true" :style="{ height: contentHeight - 90 + 'px' }" :scroll-into-view="scrollIntoIndex">
    <view>something</view>
</scroll-view>


// script
initHeight() {
            let screenHeight = uni.getSystemInfoSync().screenHeight;

            this.$nextTick(() => {
                const query = uni.createSelectorQuery().in(this);
                query
                    .select('.tab-content')
                    .boundingClientRect((data) => {
                        const contentHeight = screenHeight - data.top;
                        this.contentHeight = contentHeight - uni.getSystemInfoSync().statusBarHeight - 80;
                    })
                    .exec();
            });
        },

2、scroll-into-view和子元素的id设置有问题(经测试设置没问题)

二、最终处理方式：

调整scroll-view高度设置，在js中计算完成了再放到标签style属性内

// template
<scroll-view class="im-message-list" id="refMsgList" scroll-y="true" :style="{ height: messageHeight }" :scroll-into-view="scrollIntoIndex">
    <view>something</view>
</scroll-view>


// script
initHeight() {
            let screenHeight = uni.getSystemInfoSync().screenHeight;

            this.$nextTick(() => {
                const query = uni.createSelectorQuery().in(this);
                query
                    .select('.tab-content')
                    .boundingClientRect((data) => {
                        const contentHeight = screenHeight - data.top;
                        this.contentHeight = contentHeight - uni.getSystemInfoSync().statusBarHeight - 80;
                        this.messageHeight = `${this.contentHeight - 90}px`
                        if (this.messageList.length) {
                            const index = this.messageList[this.messageList.length - 1]?.id
                            this.scrollIntoIndex = `chat-${index}`
                        }
                    })
                    .exec();
            });
        },

 具体为什么初版不生效还不清楚，有可能模板内语法有问题，但是我看着没毛病哈哈哈。。。。