MovableArea - 《Taro 文档帮助手册教程》

sidebar_label: MovableArea
Type
Examples
MovableAreaProps
- Property Support
API Support

title: MovableArea

sidebar_label: MovableArea

A movable area of the movable-view component.

Reference

Type

ComponentType<MovableAreaProps>

Examples

import Tabs from ‘@theme/Tabs’; import TabItem from ‘@theme/TabItem’;

tsx
class App extends Components {
  render () {
    return (
      <MovableArea style='height: 200px; width: 200px; background: red;'>
        <MovableView style='height: 50px; width: 50px; background: blue;' direction='all'>The meaning of travel</MovableView>
      </MovableArea>
    )
  }
}

html
  <movable-area style='height: 200px; width: 200px; background: red;'>
    <movable-view style='height: 50px; width: 50px; background: blue;' direction='all'>On the road</movable-view>
  </movable-area>

MovableAreaProps

Property	Type	Default	Required	Description
scaleArea	`boolean`	`false`	No	When the movable-view inside is set to support two-finger zoom, setting this value modifies the area where the zoom gesture takes effect to the entire movable-area.

Property Support

Property	WeChat Mini-Program	H5	React Native
MovableAreaProps.scaleArea	✔️

API Support

API	WeChat Mini-Program	H5	React Native
MovableArea	✔️		✔️