HarmonyOS 鸿蒙Next往外层组件里添加自定义组件

可以通过将自定义视图组件添加到现有视图容器中来实现类似于 Android 的 parent.addView(customView) 的功能。

1. 创建自定义组件

首先，定义一个自定义组件 CustomView。

import { Component } from '[@ohos](/user/ohos)/tv-ui';
export class CustomView extends Component {
render() {
return (
<div style=“width: 100px; height: 100px; background-color: red;”>
Custom View
</div>
);
}
}
 

2. 将自定义组件添加到父容器中

在主组件中创建一个容器并将 CustomView 添加到该容器中。

import { Component } from ‘@ohos/tv-ui’;
import { CustomView } from ‘./CustomView’;

@Entry
export class MyApp extends Component {
render() {
return (
<div style=“width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;”>
<CustomView />
</div>
);
}
}