# movable-area

draggable area

Since the architecture of the app and applet is that the logic layer is separated from the view layer, using js to monitor and drag will cause frequent communication between the logic layer and the view layer, affecting performance. In order to facilitate high-performance dragging, the platform encapsulates the movable-area component.

movable-area refers to the draggable area, and the movable-view component is embedded in it to indicate the draggable area.

That is, finger/mouse hold down movable-view to drag or pinch to zoom, but cannot drag the range specified by movable-area.

Of course, instead of dragging, you can use code to trigger the move and zoom of movable-view in movable-area.


Platform Difference Description

App H5 微信小程序 支付宝小程序 百度小程序 抖音小程序 飞书小程序 QQ小程序 快应用 360小程序 快手小程序 京东小程序

Property description

property name type default value description
scale-area Boolean false When the movable-view inside is set to support two-finger zooming, setting this value can modify the effective area of the zoom gesture to the entire movable-area

Note: movable-area must set the width and height properties, if not set the default is 10px

  • The movable-area app-nvue platform currently does not support gesture zooming and conflicts with scrolling.
On This Page