• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# ContentSlot
2
3The **ContentSlot** component is a component designed to render and manage components created on the native layer using C APIs.
4
5With support for hybrid development, the **ContentSlot** component is recommended when the container is an ArkTS component and the child component is created on the native side.
6
7> **NOTE**
8>
9> The initial APIs of this module are supported since API version 12. Newly added APIs will be marked with a superscript to indicate their earliest API version.
10
11## APIs
12
13ContentSlot(content: Content)
14
15Called when content is added to a placeholder component
16
17**Atomic service API**: This API can be used in atomic services since API version 12.
18
19**System capability**: SystemCapability.ArkUI.ArkUI.Full
20
21**Parameters**
22
23| Name | Type| Mandatory| Description                                                    |
24| ------- | -------- | ---- | ------------------------------------------------------------ |
25| content | [Content](../js-apis-arkui-Content.md)  | Yes  | Manager of the **ContentSlot** component. Through the APIs provided by the native side, it can register and trigger the attach and detach event callbacks for **ContentSlot**, as well as manage the child components of **ContentSlot**.|
26
27**Example**
28
29The following example shows the basic usage of **ContentSlot**.
30
31```ts
32import { nativeNode } from'libNativeNode.so' // .so file you implemented
33import { NodeContent } from '@kit.ArkUI'
34
35@Entry
36@Component
37struct Parent {
38    private nodeContent: Content = new NodeContent();
39
40    aboutToAppear() {
41        // Create a node through the C API and add it to the nodeContent manager.
42        nativeNode.createNativeNode(this.nodeContent);
43    }
44
45    build() {
46        Column() {
47            // Display the native components stored in the nodeContent manager.
48            ContentSlot(this.nodeContent)
49        }
50    }
51}
52```
53