diff --git a/zh-cn/application-dev/ui/ui-ts-component-chaining.md b/zh-cn/application-dev/ui/ui-ts-component-chaining.md
new file mode 100644
index 0000000000000000000000000000000000000000..6cf9aa30818da89df691d61e7c6591a1ad365f5c
--- /dev/null
+++ b/zh-cn/application-dev/ui/ui-ts-component-chaining.md
@@ -0,0 +1,45 @@
+# 自定义组件链式调用
+
+> **说明：**该写法从API version 9开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 
+
+@Component组件链式调用可以实现同一组件不同样式显示的效果。
+
+> **说明：**在自定义组件使用链式写法时不能使用尾随闭包（ 在初始化自定义组件时，组件名称紧跟一个大括号“{}”形成尾随闭包场景（Index(){}`）。开发者可把尾随闭包看做一个容器，向其填充内容，如在闭包内增加组件（`{Column(){Text("content")}` ）。
+
+```
+@Entry
+@Component
+struct Index {
+@State bannerValue: string = 'Hello,world';
+build() {
+  Column() {
+    Chind1({ChindBannerValue:$bannerValue})
+    .height(60)
+    .width(250)
+    .border({width:5, color:0x317AF7, radius:10, style: BorderStyle.Dotted})
+    Chind2({ChindBannerValue:$bannerValue});
+  }
+} 
+}
+
+@Component
+struct Chind1{
+  @Link ChindBannerValue: string;
+  build() {
+    Column() {
+      Text(this.ChindBannerValue)
+      .fontSize(30)
+    }
+  }
+}
+
+@Component
+struct Chind2{
+  @Link ChindBannerValue: string;
+  build() {
+    Text(this.ChindBannerValue)
+    .fontSize(30)
+  }
+}
+```
+