使用 scroll-view 出现控制台报错

下面的代码片段是官方的 uni-datetime-picker 组件中 calendar.vue 组件的 template 内容。
因为日历内容高度过高超过高度范围,所以我在 .uni-calendar__content 元素内嵌套了 scroll-view 组件,让日历内容可以滚动。

 function _scrollTopChanged(val) {  
    if (props2.scrollY) {  
      {  
        if (props2.scrollWithAnimation) {  
          scrollTo2(val, "y");  
        } else {  
          main.value.scrollTop = val;  
        }  
      }  
    }  
  }

大概原因是 main.value 为 null,但是不清楚为什么 main.value 为 null,因为我在其他地方用同样的方式使用 scroll-view 组件都没有发现这个问题。
现在只要日历刚加载就会报这个错误。请问这个问题应该怎么解决

<template>  
    <view class="uni-calendar" @mouseleave="leaveCale">  
        <view v-if="!insert&&show" class="uni-calendar__mask" :class="{'uni-calendar--mask-show':aniMaskShow}"  
            @click="clean"></view>  
        <view v-if="insert || show" class="uni-calendar__content"  
            :class="{'uni-calendar--fixed':!insert,'uni-calendar--ani-show':aniMaskShow, 'uni-calendar__content-mobile': aniMaskShow}">  
            <scroll-view scroll-y="true" class="calendar-scroll-wrapper" style="height: 400px">  
              <view class="uni-calendar__header" :class="{'uni-calendar__header-mobile' :!insert}">  
                <view v-if="left" class="uni-calendar__header-btn-box" @click.stop="pre">  
                    <view class="uni-calendar__header-btn uni-calendar--left"></view>  
                </view>  
                <picker mode="date" :value="date" fields="month" @change="bindDateChange">  
                    <text  
                        class="uni-calendar__header-text">{{ (nowDate.year||'') + yearText + ( nowDate.month||'') + monthText}}</text>  
                </picker>  
                <view v-if="right" class="uni-calendar__header-btn-box" @click.stop="next">  
                    <view class="uni-calendar__header-btn uni-calendar--right"></view>  
                </view>  
                <view v-if="!insert" class="dialog-close" @click="clean">  
                    <view class="dialog-close-plus" data-id="close"></view>  
                    <view class="dialog-close-plus dialog-close-rotate" data-id="close"></view>  
                </view>  

                <!-- <text class="uni-calendar__backtoday" @click="backtoday">回到今天</text> -->  
              </view>  
              <view class="uni-calendar__box">  
                <view v-if="showMonth" class="uni-calendar__box-bg">  
                    <text class="uni-calendar__box-bg-text">{{nowDate.month}}</text>  
                </view>  
                <view class="uni-calendar__weeks" style="padding-bottom: 7px;">  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{SUNText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{MONText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{TUEText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{WEDText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{THUText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{FRIText}}</text>  
                    </view>  
                    <view class="uni-calendar__weeks-day">  
                        <text class="uni-calendar__weeks-day-text">{{SATText}}</text>  
                    </view>  
                </view>  
                <view class="uni-calendar__weeks" v-for="(item,weekIndex) in weeks" :key="weekIndex">  
                    <view class="uni-calendar__weeks-item" v-for="(weeks,weeksIndex) in item" :key="weeksIndex">  
                        <calendar-item class="uni-calendar-item--hook" :weeks="weeks" :calendar="calendar"  
                            :selected="selected" :lunar="lunar" :checkHover="range" @change="choiceDate"  
                            @handleMouse="handleMouse">  
                        </calendar-item>  
                    </view>  
                </view>  
              </view>  
              <view v-if="!insert && !range && typeHasTime" class="uni-date-changed uni-calendar--fixed-top"  
                style="padding: 0 80px;">  
                <view class="uni-date-changed--time-date">{{tempSingleDate ? tempSingleDate : selectDateText}}</view>  
                <time-picker type="time" :start="reactStartTime" :end="reactEndTime" v-model="time"  
                    :disabled="!tempSingleDate" :border="false" :hide-second="hideSecond" class="time-picker-style">  
                </time-picker>  
              </view>  

              <view v-if="!insert && range && typeHasTime" class="uni-date-changed uni-calendar--fixed-top">  
                <view class="uni-date-changed--time-start">  
                    <view class="uni-date-changed--time-date">{{tempRange.before ? tempRange.before : startDateText}}  
                    </view>  
                    <time-picker type="time" :start="reactStartTime" v-model="timeRange.startTime" :border="false"  
                        :hide-second="hideSecond" :disabled="!tempRange.before" class="time-picker-style">  
                    </time-picker>  
                </view>  
                <uni-icons type="arrowthinright" color="#999" style="line-height: 50px;"></uni-icons>  
                <view class="uni-date-changed--time-end">  
                    <view class="uni-date-changed--time-date">{{tempRange.after ? tempRange.after : endDateText}}</view>  
                    <time-picker type="time" :end="reactEndTime" v-model="timeRange.endTime" :border="false"  
                        :hide-second="hideSecond" :disabled="!tempRange.after" class="time-picker-style">  
                    </time-picker>  
                </view>  
              </view>  
              <view v-if="!insert" class="uni-date-changed uni-date-btn--ok">  
                <!-- <view class="uni-calendar__header-btn-box">  
                    <text class="uni-calendar__button-text uni-calendar--fixed-width">{{okText}}</text>  
                </view> -->  
                <view class="uni-datetime-picker--btn" @click="confirm">{{confirmText}}</view>  
              </view>  
            </scroll-view>  
        </view>  
    </view>  
</template>