微信小程序movable-view如何设置长尾词搜索的可移动范围？

本文共计2322个文字，预计阅读时间需要10分钟。

目录前言重新认识movable-area和movable-viewmovable-area和movable-view的包含关系movable-area与movable-view区域交叉movable-area与movable-view区域大小相同movable-view的子元素内容超过其尺寸

目录

• 前言
• 重新认识movable-area和movable-view
• movable-area和movable-view的一方完全包含另一方
• movable-area与movable-view区域交叉
• movable-area与movable-view区域大小同时为0
• movable-view的子元素内容超过其尺寸
• movable-view决定可拖动元素
• 实现一个卡片多段式拖动

前言

开发过小程序的同学可能对这两个内置组件并不陌生，他们配合用来实现在页面中可以拖拽滑动，其中：

• movable-area表示元素可移动的区域，它决定元素移动的区域范围
• movable-view表示可移动的视图容器，它决定了什么元素可以移动

使用上要求movable-view必须是movable-area的直接子节点，否则不能移动。

这两个组件对于比较常规的可拖拽移动产品需求可以轻松应对，但是针对一些稍微复杂的需求，可能需要对他们的用法原理要进一步掌握理解。