diff --git a/packages/site/docs/manual/core-concept/state.en.md b/packages/site/docs/manual/core-concept/state.en.md
index 060c217732b..902c1f4a03d 100644
--- a/packages/site/docs/manual/core-concept/state.en.md
+++ b/packages/site/docs/manual/core-concept/state.en.md
@@ -37,18 +37,24 @@ Currently, G6 supports configuring state styles within style mappings, for examp
 {
   node: {
     style: {/** Default State Style */},
-    selected: {/** Selected State Style */},
-    [State name]: {/** State Style */}
+    state: {
+      selected: {/** Selected State Style */},
+      [State name]: {/** State Style */}
+    }
   },
   edge: {
-   style: {/** Default State Style */},
-    selected: {/** Selected State Style */},
-    [State name]: {/** State Style */}
+    style: {/** Default State Style */},
+    state: {
+      selected: {/** Selected State Style */},
+      [State name]: {/** State Style */}
+    }
   },
   combo: {
     style: {/** Default State Style */},
-    selected: {/** Selected State Style */},
-    [State name]: {/** State Style */}
+    state: {
+      selected: {/** Selected State Style */},
+      [State name]: {/** State Style */}
+    }
   }
 }
 ```
@@ -136,7 +142,9 @@ To customize states, simply add them to the style mapping, for example:
 {
   node: {
     // Custom state name: 'custom-state'
-    'custom-state': {/** Custom State Style */}
+    state: {
+       'custom-state': {/** Custom State Style */}
+    }
   },
 }
 ```
diff --git a/packages/site/docs/manual/core-concept/state.zh.md b/packages/site/docs/manual/core-concept/state.zh.md
index be6d04cf4bb..da6d30b874a 100644
--- a/packages/site/docs/manual/core-concept/state.zh.md
+++ b/packages/site/docs/manual/core-concept/state.zh.md
@@ -11,7 +11,7 @@ order: 3
 
 ## 状态类型
 
-G6 中的状态类型是一个字符串数组(`number[]`)，即一个元素可以同时存在多个状态，例如一个节点可以同时处于**选中**和**悬停**状态。
+G6 中的状态类型是一个字符串数组(`string[]`)，即一个元素可以同时存在多个状态，例如一个节点可以同时处于**选中**和**悬停**状态。
 
 G6 预设的状态包括：
 
@@ -38,18 +38,24 @@ G6 预设的状态包括：
 {
   node: {
     style: {/** 默认状态样式 */},
-    selected: {/** 选中状态样式 */},
-    [状态名]: {/** 状态样式 */}
+    state: {
+      selected: {/** 选中状态样式 */},
+      [状态名]: {/** 状态样式 */}
+    }
   },
   edge: {
    style: {/** 默认状态样式 */},
-    selected: {/** 选中状态样式 */},
-    [状态名]: {/** 状态样式 */}
+   state: {
+      selected: {/** 选中状态样式 */},
+      [状态名]: {/** 状态样式 */}
+    }
   },
   combo: {
     style: {/** 默认状态样式 */},
-    selected: {/** 选中状态样式 */},
-    [状态名]: {/** 状态样式 */}
+    state: {
+      selected: {/** 选中状态样式 */},
+      [状态名]: {/** 状态样式 */}
+    }
   }
 }
 ```
@@ -137,7 +143,9 @@ graph.setElementState('node-1', []);
 {
   node: {
     // 自定义状态名为：'custom-state'
-    'custom-state': {/** 自定义状态样式 */}
+    state: {
+      'custom-state': {/** 自定义状态样式 */}
+    }
   },
 }
 ```