diff --git a/frameworks/bridge/declarative_frontend/ark_component/src/ArkClassDefine.ts b/frameworks/bridge/declarative_frontend/ark_component/src/ArkClassDefine.ts
index cf341f6cf2650cf6eb80c9d6ee24546b50a38e07..dc95c02f97aaa4d795337c5b04f54808d982ffe1 100644
--- a/frameworks/bridge/declarative_frontend/ark_component/src/ArkClassDefine.ts
+++ b/frameworks/bridge/declarative_frontend/ark_component/src/ArkClassDefine.ts
@@ -1922,6 +1922,20 @@ class ArkNavigationTitle {
   }
 }
 
+class ArkNavigationToolBarConfiguration {
+  value: Array<ToolbarItem> | undefined;
+  options?: NavigationToolbarOptions | undefined;
+
+  constructor() {
+    this.value = undefined;
+    this.options = undefined;
+  }
+  isEqual(another: ArkNavigationToolBarConfiguration): boolean {
+    return (this.value === another.value) && (this.options.backgroundColor === another.options.backgroundColor) &&
+      (this.options.backgroundBlurStyle === another.options.backgroundBlurStyle) &&
+      (this.options.barStyle === another.options.barStyle);
+  }
+}
 class ArkNavHideTitleBarOrToolBar {
   isHide: boolean;
   animated: boolean;
diff --git a/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavDestination.ts b/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavDestination.ts
index 39d58aee76091b0b1406a85a0d0b61d7dc2daec9..4d193191ad895ce54aa6a6bea0a15bee65c899ad 100644
--- a/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavDestination.ts
+++ b/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavDestination.ts
@@ -82,9 +82,14 @@ class ArkNavDestinationComponent extends ArkComponent implements NavDestinationA
     }
     return this;
   }
-  toolbarConfiguration(value: any): this {
+  toolbarConfiguration(value: Array<ToolbarItem> | undefined, options?: NavigationToolbarOptions | undefined): this {
+    let configuration = new ArkNavigationToolBarConfiguration();
+    configuration.value = value;
+    if (!isNull(options)) {
+      configuration.options = options;
+    }
     modifierWithKey(this._modifiersWithKeys, NavDestinationToolBarConfigurationModifier.identity,
-      NavDestinationToolBarConfigurationModifier, value);
+      NavDestinationToolBarConfigurationModifier, configuration);
     return this;
   }
   backButtonIcon(value: any): this {
@@ -200,16 +205,16 @@ class ArkNavDestinationComponent extends ArkComponent implements NavDestinationA
   }
 }
 
-class NavDestinationToolBarConfigurationModifier extends ModifierWithKey<Array<ToolbarItem> | undefined> {
-  constructor(value: Array<ToolbarItem> | undefined) {
+class NavDestinationToolBarConfigurationModifier extends ModifierWithKey<ArkNavigationToolBarConfiguration> {
+  constructor(value: ArkNavigationToolBarConfiguration) {
     super(value);
   }
   static identity: Symbol = Symbol('toolbarConfiguration');
   applyPeer(node: KNode, reset: boolean): void {
-    if (reset) {
+    if (reset || !this.value) {
       getUINativeModule().navDestination.resetToolBarConfiguration(node);
     } else {
-      getUINativeModule().navDestination.setToolBarConfiguration(node, this.value);
+      getUINativeModule().navDestination.setToolBarConfiguration(node, this.value.value, this.value.options);
     }
   }
   checkObjectDiff(): boolean {
diff --git a/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavigation.ts b/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavigation.ts
index 6c401803038604948674ec50b974dfdd6dcda76b..39b4a76f7811595eeb641c12f7a47b37d283801e 100644
--- a/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavigation.ts
+++ b/frameworks/bridge/declarative_frontend/ark_component/src/ArkNavigation.ts
@@ -124,9 +124,14 @@ class ArkNavigationComponent extends ArkComponent implements NavigationAttribute
     modifierWithKey(this._modifiersWithKeys, ToolBarModifier.identity, ToolBarModifier, callback);
     return this;
   }
-  toolbarConfiguration(value: any): NavigationAttribute {
+  toolbarConfiguration(value: Array<ToolbarItem> | undefined, options?: NavigationToolbarOptions | undefined): NavigationAttribute {
+    let configuration = new ArkNavigationToolBarConfiguration();
+    configuration.value = value;
+    if (!isNull(options)) {
+      configuration.options = options;
+    }
     modifierWithKey(this._modifiersWithKeys, ToolBarConfigurationModifier.identity,
-      ToolBarConfigurationModifier, value);
+      ToolBarConfigurationModifier, configuration);
     return this;
   }
   hideToolBar(isHide: boolean, animated?: boolean): NavigationAttribute {
@@ -292,16 +297,16 @@ class ToolBarModifier extends ModifierWithKey<object | undefined> {
   }
 }
 
-class ToolBarConfigurationModifier extends ModifierWithKey<Array<ToolbarItem> | undefined> {
-  constructor(value: Array<ToolbarItem> | undefined) {
+class ToolBarConfigurationModifier extends ModifierWithKey<ArkNavigationToolBarConfiguration> {
+  constructor(value: ArkNavigationToolBarConfiguration) {
     super(value);
   }
   static identity: Symbol = Symbol('toolbarConfiguration');
   applyPeer(node: KNode, reset: boolean): void {
-    if (reset) {
+    if (reset || !this.value) {
       getUINativeModule().navigation.resetToolBarConfiguration(node);
     } else {
-      getUINativeModule().navigation.setToolBarConfiguration(node, this.value);
+      getUINativeModule().navigation.setToolBarConfiguration(node, this.value.value, this.value.options);
     }
   }
   checkObjectDiff(): boolean {
diff --git a/frameworks/bridge/declarative_frontend/engine/arkComponent.js b/frameworks/bridge/declarative_frontend/engine/arkComponent.js
index b3deea545aa0bbb2bada9005120bccf2abf8220d..360dda61c47559781b7acf0be1e86a1bf3425fac 100755
--- a/frameworks/bridge/declarative_frontend/engine/arkComponent.js
+++ b/frameworks/bridge/declarative_frontend/engine/arkComponent.js
@@ -19961,6 +19961,18 @@ class ArkNavHideTitleBarOrToolBar {
   }
 }
 
+class ArkNavigationToolBarConfiguration {
+  constructor() {
+    this.value = undefined;
+    this.options = undefined;
+  }
+  isEqual(another) {
+    return (this.value === another.value) && (this.options.backgroundColor === another.options.backgroundColor) &&
+      (this.options.backgroundBlurStyle === another.options.backgroundBlurStyle) &&
+      (this.options.barStyle === another.options.barStyle);
+  }
+}
+
 class ArkEmitterPropertyOptions {
   constructor() {
     this.index = undefined;
@@ -24896,9 +24908,14 @@ class ArkNavDestinationComponent extends ArkComponent {
     }
     return this;
   }
-  toolbarConfiguration(value) {
+  toolbarConfiguration(value, options) {
+    let configuration = new ArkNavigationToolBarConfiguration();
+    configuration.value = value;
+    if (!isNull(options)) {
+      configuration.options = options;
+    }
     modifierWithKey(this._modifiersWithKeys, NavDestinationToolBarConfigurationModifier.identity,
-      NavDestinationToolBarConfigurationModifier, value);
+      NavDestinationToolBarConfigurationModifier, configuration);
     return this;
   }
   hideBackButton(value) {
@@ -25069,10 +25086,10 @@ class NavDestinationToolBarConfigurationModifier extends ModifierWithKey {
     super(value);
   }
   applyPeer(node, reset) {
-    if (reset) {
+    if (reset || !this.value) {
       getUINativeModule().navDestination.resetToolBarConfiguration(node);
     } else {
-      getUINativeModule().navDestination.setToolBarConfiguration(node, this.value);
+      getUINativeModule().navDestination.setToolBarConfiguration(node, this.value.value, this.value.options);
     }
   }
   checkObjectDiff() {
@@ -26146,9 +26163,14 @@ class ArkNavigationComponent extends ArkComponent {
     modifierWithKey(this._modifiersWithKeys, ToolBarModifier.identity, ToolBarModifier, value);
     return this;
   }
-  toolbarConfiguration(value) {
+  toolbarConfiguration(value, options) {
+    let configuration = new ArkNavigationToolBarConfiguration();
+    configuration.value = value;
+    if (!isNull(options)) {
+      configuration.options = options;
+    }
     modifierWithKey(this._modifiersWithKeys, ToolBarConfigurationModifier.identity,
-      ToolBarConfigurationModifier, value);
+      ToolBarConfigurationModifier, configuration);
     return this;
   }
   hideToolBar(isHide, animated) {
@@ -26322,10 +26344,10 @@ class ToolBarConfigurationModifier extends ModifierWithKey {
     super(value);
   }
   applyPeer(node, reset) {
-    if (reset) {
+    if (reset || !this.value) {
       getUINativeModule().navigation.resetToolBarConfiguration(node);
     } else {
-      getUINativeModule().navigation.setToolBarConfiguration(node, this.value);
+      getUINativeModule().navigation.setToolBarConfiguration(node, this.value.value, this.value.options);
     }
   }
   checkObjectDiff() {
diff --git a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_nav_destination_bridge.cpp b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_nav_destination_bridge.cpp
index f6e7b0e879891f80a6eb90a9adda655f8c4f9807..6b22e2169b448516299f22c1535042ca94321a08 100644
--- a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_nav_destination_bridge.cpp
+++ b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_nav_destination_bridge.cpp
@@ -159,7 +159,7 @@ ArkUINativeModuleValue NavDestinationBridge::SetToolBarConfiguration(ArkUIRuntim
     NG::NavigationToolbarOptions options;
     NavDestinationModelNG::ResetResObj(
         frameNode, NavDestinationPatternType::NAV_DESTINATION, "navigation.navigationToolbarOptions");
-    JSNavigationUtils::ParseToolbarOptions(info, options);
+    JSNavigationUtils::ParseToolbarOptions(info, options, NUM_2);
     NavDestinationModel::GetInstance()->SetToolBarOptions(std::move(options));
     return panda::JSValueRef::Undefined(vm);
 }
diff --git a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_navigation_bridge.cpp b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_navigation_bridge.cpp
index 234d46b36021c5e69878a7964d5b331dc6d20914..b5af1608d1f6126e2d76f483364279f0961c14b8 100644
--- a/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_navigation_bridge.cpp
+++ b/frameworks/bridge/declarative_frontend/engine/jsi/nativeModule/arkts_native_navigation_bridge.cpp
@@ -381,8 +381,8 @@ ArkUINativeModuleValue NavigationBridge::SetToolBarConfiguration(ArkUIRuntimeCal
         }
     }
     NG::NavigationToolbarOptions options;
-    JSNavigationUtils::ParseToolbarOptions(info, options);
     NavigationModelNG::ResetResObj(frameNode, NavigationPatternType::NAV_BAR, "navigation.navigationToolbarOptions");
+    JSNavigationUtils::ParseToolbarOptions(info, options, NUM_2);
     NavigationModel::GetInstance()->SetToolbarOptions(std::move(options));
     return panda::JSValueRef::Undefined(vm);
 }
diff --git a/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.cpp b/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.cpp
index 7b95b439f7b11a0a3c697525edd6b781d97b426b..3e8412721047b8836625374d03794ad956377acd 100644
--- a/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.cpp
+++ b/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.cpp
@@ -323,7 +323,8 @@ void JSNavigationUtils::ParseTitleBarOptions(
     }
 }
 
-void JSNavigationUtils::ParseToolbarOptions(const JSCallbackInfo& info, NG::NavigationToolbarOptions& options)
+void JSNavigationUtils::ParseToolbarOptions(
+    const JSCallbackInfo& info, NG::NavigationToolbarOptions& options, const int32_t optionSituation)
 {
     if (Container::GreatOrEqualAPITargetVersion(PlatformVersion::VERSION_TWELVE)) {
         auto pipelineContext = PipelineBase::GetCurrentContext();
@@ -338,9 +339,13 @@ void JSNavigationUtils::ParseToolbarOptions(const JSCallbackInfo& info, NG::Navi
             options.bgOptions.color = Color::TRANSPARENT;
         }
     }
-    if (info.Length() > 1) {
-        ParseBackgroundOptions(info[1], options.bgOptions);
-        ParseBarOptions(info[1], options.brOptions);
+    if (optionSituation < 0) {
+        return;
+    }
+    auto infoLength = static_cast<uint32_t>(optionSituation);
+    if (info.Length() > infoLength) {
+        ParseBackgroundOptions(info[optionSituation], options.bgOptions);
+        ParseBarOptions(info[optionSituation], options.brOptions);
     }
 }
 
diff --git a/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.h b/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.h
index c645a848d69f8dfabcfcc26e55dae9a250eebfff..1867bc69c1fcc1eee79536f4f0d3171e5b1e7104 100644
--- a/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.h
+++ b/frameworks/bridge/declarative_frontend/jsview/js_navigation_utils.h
@@ -33,7 +33,8 @@ public:
         const JSCallbackInfo& info, const JSRef<JSArray>& jsArray, std::vector<NG::BarItem>& items);
     static void ParseTitleBarOptions(const JSCallbackInfo& info,
         bool needSetDefaultValue, NG::NavigationTitlebarOptions& options);
-    static void ParseToolbarOptions(const JSCallbackInfo& info, NG::NavigationToolbarOptions& options);
+    static void ParseToolbarOptions(
+        const JSCallbackInfo& info, NG::NavigationToolbarOptions& options, const int32_t optionSituation = 1);
     static void ParseHideToolBarText(const JSCallbackInfo& info, bool& hideText);
     static void ParseMenuOptions(const JSRef<JSVal>& optObj, NG::NavigationMenuOptions& options);
     static void ParseToolBarMoreButtonOptions(const JSRef<JSVal>& optObj, NG::MoreButtonOptions& options);