jd-opensource / jd-opensource/taro-ui

【AtTabs】:AtTabsPane嵌套ScrollView,假设有两个AtTabsPane嵌套ScrollView,那么下拉刷新会触发两次

Open
#1,076 3 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.7k
Forks
740
PR merge metrics
No merged PRs in 30d

Description

**问题描述**
AtTabsPane下嵌套ScrollView,假设有两个AtTabsPane,那么ScrollView的下拉刷新会触发两次,从表现上来看,应该是AtTabsPane这东西,把所有的ScrollView渲染出来,我拉了2个ScrollView 的下拉刷新

![image](https://user-images.githubusercontent.com/16217324/83096664-da0ebb00-a0d8-11ea-9155-08c4229f2a7b.png)

**复现步骤**
```
/* eslint-disable no-undef */
import Taro, { Component } from '@tarojs/taro';
import { View, ScrollView } from '@tarojs/components';
import { AtTabs, AtTabsPane } from 'taro-ui';

export default class Index extends Component {
constructor(props) {
super(props);
this.state = {
current: 1,
refresherTriggered: false
};
}

handleClick = (val) => {
this.setState({ current: val });
}

// 滚动到底触发
onScrollToLower(e) {
console.log('onScrollToLower', e);
}

// 下拉刷新触发
onRefresherRefresh = () => {
console.log(1);
this.setState({
refresherTriggered: true
});
console.log(2);
setTimeout(() => {
this.setState({ refresherTriggered: false });
}, 500);
}

render() {
const { current, refresherTriggered } = this.state;
const tabList = [{ title: '全部' }, { title: '待处理' }];
const scrollStyle = {
height: '100vh'
};
const vStyleA = {
height: '150px',
'background-color': 'rgb(26, 173, 25)'
};
const vStyleB = {
height: '150px',
'background-color': 'rgb(39,130,215)'
};
const vStyleC = {
height: '150px',
'background-color': 'rgb(241,241,241)',
color: '#333'
};
return (




A
B
C




A
B
C




);
}
}
```

**期望行为**
期望ScrollView触发一次

**系统信息**
"taro-ui": "^2.2.1"

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.