修改uview中u-action-sheet内容过多实现滚动效果

1.如果你的uview是通过npm依赖包形式安装的不建议直接修改node_modules源码,可以使用uni_modules方式引入;

uni_modules引入uview

2.此版本是uView2.0版本,找到uni_modules/uview-ui/components/u-action-sheet/u-action-sheet.vue文件

<template>
  <u-popup
      :show="show"
      mode="bottom"
      @close="closeHandler"
      :safeAreaInsetBottom="safeAreaInsetBottom"
      :round="round"
  >
    <view class="u-action-sheet">
      <view
          class="u-action-sheet__header"
          v-if="title"
      >
        <text class="u-action-sheet__header__title u-line-1">{{ title }}</text>
        <view
            class="u-action-sheet__header__icon-wrap"
            @tap.stop="cancel"
        >
          <u-icon
              name="close"
              size="17"
              color="#c8c9cc"
              bold
          ></u-icon>
        </view>
      </view>
      <text
          class="u-action-sheet__description"
          :style="[{
					marginTop: `${title && description ? 0 : '18px'}`
				}]"
          v-if="description"
      >{{ description }}
      </text>
      <slot>
        <u-line v-if="description"></u-line>
        <view class="u-action-sheet__item-wrap">
          <scroll-view scroll-y style="min-height: 200rpx;max-height: 800rpx;">
            <template v-for="(item, index) in actions">
              <!-- #ifdef MP -->
              <button
                  :key="index"
                  class="u-reset-button"
                  :openType="item.openType"
                  @getuserinfo="onGetUserInfo"
                  @contact="onContact"
                  @getphonenumber="onGetPhoneNumber"
                  @error="onError"
                  @launchapp="onLaunchApp"
                  @opensetting="onOpenSetting"
                  :lang="lang"
                  :session-from="sessionFrom"
                  :send-message-title="sendMessageTitle"
                  :send-message-path="sendMessagePath"
                  :send-message-img="sendMessageImg"
                  :show-message-card="showMessageCard"
                  :app-parameter="appParameter"
                  @tap="selectHandler(index)"
                  :hover-class="!item.disabled && !item.loading ? 'u-action-sheet--hover' : ''"
              >
                <!-- #endif -->
                <view
                    class="u-action-sheet__item-wrap__item"
                    @tap.stop="selectHandler(index)"
                    :hover-class="!item.disabled && !item.loading ? 'u-action-sheet--hover' : ''"
                    :hover-stay-time="150"
                >
                  <template v-if="!item.loading">
                    <text
                        class="u-action-sheet__item-wrap__item__name"
                        :style="[itemStyle(index)]"
                    >{{ item.name }}
                    </text>
                    <text
                        v-if="item.subname"
                        class="u-action-sheet__item-wrap__item__subname"
                    >{{ item.subname }}
                    </text>
                  </template>
                  <u-loading-icon
                      v-else
                      custom-class="van-action-sheet__loading"
                      size="18"
                      mode="circle"
                  />
                </view>
                <!-- #ifdef MP -->
              </button>
              <!-- #endif -->
              <u-line v-if="index !== actions.length - 1"></u-line>
            </template>

          </scroll-view>
        </view>
      </slot>
      <u-gap
          bgColor="#eaeaec"
          height="6"
          v-if="cancelText"
      ></u-gap>
      <view hover-class="u-action-sheet--hover">
        <text
            @touchmove.stop.prevent
            :hover-stay-time="150"
            v-if="cancelText"
            class="u-action-sheet__cancel-text"
            @tap="cancel"
        >{{ cancelText }}
        </text>
      </view>
    </view>
  </u-popup>
</template>

3.主要实现代码是如下代码,把遍历生成的数据放进如下标签内即可;

 <scroll-view scroll-y style="min-height: 200rpx;max-height: 800rpx;"></scroll-view>