1# Menu 2 3The menu bound to a component through [bindContextMenu](./ts-universal-attributes-menu.md#attributes) on a page can be closed as needed. 4 5> **NOTE** 6> 7> The APIs of this module are supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version. 8 9 10## ContextMenu.close 11 12|Name|Description| 13|----|---| 14| close(): void | Closes the menu bound to this component through [bindContextMenu](./ts-universal-attributes-menu.md#attributes) on a page.| 15 16 17## Example 18 19```ts 20// xxx.ets 21@Entry 22@Component 23struct Index { 24 @Builder MenuBuilder() { 25 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 26 Button('Test ContextMenu1') 27 Divider().strokeWidth(2).margin(5).color(Color.Black) 28 Button('Test ContextMenu2') 29 Divider().strokeWidth(2).margin(5).color(Color.Black) 30 Button('Test ContextMenu3') 31 } 32 .width(200) 33 .height(160) 34 } 35 36 build() { 37 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 38 Column() { 39 Text("Test ContextMenu") 40 .fontSize(20) 41 .width('100%') 42 .height(500) 43 .backgroundColor(0xAFEEEE) 44 .textAlign(TextAlign.Center) 45 } 46 .bindContextMenu(this.MenuBuilder, ResponseType.LongPress) 47 .onDragStart(()=>{ 48 // Close the menu when the component is dragged. 49 ContextMenu.close() 50 }) 51 } 52 .width('100%') 53 .height('100%') 54 } 55} 56``` 57 58 59
