diff --git a/packages/renderless/src/dropdown/vue.ts b/packages/renderless/src/dropdown/vue.ts
index 7039d5cbbe..a9c089c71e 100644
--- a/packages/renderless/src/dropdown/vue.ts
+++ b/packages/renderless/src/dropdown/vue.ts
@@ -45,10 +45,12 @@ export const api = ['state', 'handleMainButtonClick', 'hide', 'show', 'initDomOp
 export const renderless = (
   props: IDropdownProps,
   { reactive, watch, provide, onMounted, computed, onBeforeUnmount }: ISharedRenderlessParamHooks,
-  { emit, parent, broadcast, vm, nextTick, mode, designConfig }: IDropdownRenderlessParamUtils
+  { emit, parent, broadcast, vm, nextTick, mode, designConfig, useBreakpoint }: IDropdownRenderlessParamUtils
 ): IDropdownApi => {
   const api = {} as IDropdownApi
+  const { current } = useBreakpoint()
   const state: IDropdownState = reactive({
+    current,
     visible: false,
     timeout: null,
     focusing: false,
diff --git a/packages/vue/src/dropdown/src/mobile-first.vue b/packages/vue/src/dropdown/src/mobile-first.vue
index 7f16b8e88c..045d1a08e2 100644
--- a/packages/vue/src/dropdown/src/mobile-first.vue
+++ b/packages/vue/src/dropdown/src/mobile-first.vue
@@ -123,8 +123,11 @@ export default defineComponent({
 
       const defaultIcon = (
         <span class="block text-[0]">
-          <icon-chevron-down class="sm:block hidden will-change-transform" />
-          <icon-arrow-bottom class="sm:hidden block will-change-transform" />
+          {state.current !== 'default' ? (
+            <icon-chevron-down class="sm:block hidden will-change-transform" />
+          ) : (
+            <icon-arrow-bottom class="sm:hidden block will-change-transform" />
+          )}
         </span>
       )
 
@@ -160,8 +163,8 @@ export default defineComponent({
             type === 'primary'
               ? '[&_svg]:fill-color-bg-1'
               : state.visible
-              ? 'active:border-color-border-focus text-color-text-primary active:text-color-brand-focus focus:border-color-border-focus focus:text-color-brand-focus'
-              : '[&_svg]:fill-color-icon-placeholder'
+                ? 'active:border-color-border-focus text-color-text-primary active:text-color-brand-focus focus:border-color-border-focus focus:text-color-brand-focus'
+                : '[&_svg]:fill-color-icon-placeholder'
           ]}
           reset-time={0}>
           {defaultSlot}