rax-gesture-view

支持

Web / Weex / 小程序

描述： 手势组件，监听组件内触发的横向或纵向滑动，并触发相应事件。

安装

$ npm install rax-gesture-view --save

属性

注： 1、支持列表中的 代表h5 代表weex 代表小程序

属性	类型	默认值	必填	描述	支持
onHorizontalPan	function	-		节点被点击之后触发
onVerticalPan	function	-		长按式触发

示例

在线 Demo

/** @jsx createElement */
import {createElement, Component, render} from 'rax';
import GestureView from '../src/index';
import View from 'rax-view';
import { isWeex } from 'universal-env';
import * as DriverDOM from 'driver-dom';
import * as DriverWeex from 'driver-weex';

class App extends Component {
  onHorizontalPan = (e) => {
    console.error('onHorizontalPan:' + e.state);
  }

  onVerticalPan = (e) => {
    console.error('onVerticalPan:' + e.state);
  }

  render() {
    return (<View style={{flex: 1}}>
      <GestureView style={{width: 300, height: 300, backgroundColor: 'red'}}
        onVerticalPan={this.onVerticalPan}
        onHorizontalPan={this.onHorizontalPan}
      >pan me</GestureView>
    </View>);
  }
}

render(<App />, document.body, { driver: isWeex ? DriverWeex : DriverDOM });