# ScrollView demo

* order: 0

resetLoadmore 清除 loadmore 事件标识

---

```js
/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import ScrollView from 'nuke-scroll-view';
import RefreshControl from 'nuke-refresh-control';
import Button from 'nuke-button';

let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
    this.state = {
      data: [
        { key: 'A', bg: '#1170bc', color: '#ffffff' },
        { key: 'B', bg: '#3089dc', color: '#ffffff' },
        { key: 'C', bg: '#f1f1f1', color: '#3d4145' },
        { key: 'F', bg: 'yellow', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' },
        { key: 'G', bg: 'red', color: '#ffffff' }
      ]
    };
  }
  getViews() {
    let doms = [];
    this.state.data.map((item, index) => {
      doms.push(
        <View style={[styles.item, { backgroundColor: item.bg }]}>
          <Text style={{ color: item.color }}>{item.key}</Text>
        </View>
      );
    });

    return doms;
  }

  loadmore = () => {
    console.log('loadmore');
  };

  reset = () => {
    console.log('reset');
    this.refs.vscroller.resetLoadmore();
  };

  render() {
    return (
      <ScrollView
        ref="vscroller"
        style={styles.vscroller}
        onEndReached={this.loadmore}
        onEndReachedThreshold={50}
      >
        <Button type="primary" onPress={this.reset}>
          reset
        </Button>
        {this.getViews()}
      </ScrollView>
    );
  }
};
const styles = {
  vscroller: {
    flex: 1
  },
  item: {
    height: '400rem',
    width: '750rem',
    alignItems: 'center',
    justifyContent: 'center'
  }
};
render(<App />);
```