scroll-view设置高度，下拉刷新不起作用

在小程序中，使用scroll-view实现下拉刷新

1.scroll-view需要给一个高度，用flex-grow:1不起作用，滚动会失效。

• 解决方案：给scroll-view加一个父元素，设置flex-grow:1,在页面加载时获取父元素的高度，并且赋值给scroll-view

//初始化高度为0
  const [height, setHeight] = useState(0)

//获取父元素高度
    const query = Taro.createSelectorQuery()
    query.select('#main-wrap').boundingClientRect()
    query.exec((res) => {
      console.log(res)
      setHeight(res[0].height)
    })

//赋值给scroll-view
    <ScrollView
          refresherEnabled
          refresherDefaultStyle='none'
          refresherThreshold='50'
          refresherTriggered={trigger}
          onRefresherRefresh={refresh}
          onRefresherPulling={pulling}
          scrollY
          onScrollToLower={scrollToLower}
          className={styles['scroll-view']}
          style={{ height: height + 'px' }}
        >
          ...
 </ScrollView>

2.下拉刷新

• 开启refresherEnabled属性
• 如果像1中初始化height为0，则会出现下拉刷新不起作用，所以在初始化时，需要给一个固定的高度，且不能太小

  const [height, setHeight] = useState(672)

• 下一步，将refresherTriggered绑定一个trigger值，
  onRefresherRefresh绑定一个refresh回调函数,来改变trigger值，控制刷新的动画，这里用一个定时器来模仿请求，请求完成时将trigger置为false

  // 触发刷新
  const refresh = (e) => {
    setTrigger(true)
    setTimeout(() => {
      setTrigger(false)
    }, 1000)
  }