From 2dfc76ff8b985bc255a6e5cde8e332f63e2396a6 Mon Sep 17 00:00:00 2001
From: James-9696 <hujm969696@163.com>
Date: Mon, 9 Dec 2024 17:47:05 -0800
Subject: [PATCH 1/3] fix: modify form error

---
 .../components/form-item/src/mobile.vue       |  4 +--
 .../form-item/src/renderless/index.ts         |  9 +++--
 .../form-item/src/renderless/vue.ts           |  4 +--
 packages/mobile/components/input/src/input.ts | 35 +++++++++++--------
 .../theme-mobile/src/form-item/index.less     | 22 ++++++------
 packages/theme-mobile/src/form-item/vars.less | 16 ++++-----
 packages/theme-mobile/src/form/index.less     |  2 +-
 7 files changed, 48 insertions(+), 44 deletions(-)

diff --git a/packages/mobile/components/form-item/src/mobile.vue b/packages/mobile/components/form-item/src/mobile.vue
index 2a3006df23..e7fecfe783 100644
--- a/packages/mobile/components/form-item/src/mobile.vue
+++ b/packages/mobile/components/form-item/src/mobile.vue
@@ -227,7 +227,7 @@ export default defineComponent({
       {
         props: {
           isAutoWidth: state.labelStyle && state.labelStyle.width === 'auto',
-          updateAll: state.form.labelWidth === 'auto',
+          updateAll: state.form?.labelWidth === 'auto',
           isMobile: state.mode === 'mobile'
         }
       },
@@ -249,7 +249,7 @@ export default defineComponent({
                   mouseleave: handleMouseleave
                 }
               },
-              labelSlot || label + state.form.labelSuffix
+              labelSlot || label + (state.form?.labelSuffix || '')
             )
           : null
       ]
diff --git a/packages/mobile/components/form-item/src/renderless/index.ts b/packages/mobile/components/form-item/src/renderless/index.ts
index a5b87488d7..5a98837db3 100644
--- a/packages/mobile/components/form-item/src/renderless/index.ts
+++ b/packages/mobile/components/form-item/src/renderless/index.ts
@@ -84,7 +84,7 @@ export const computedLabelStyle =
       return result
     }
 
-    const labelWidth = props.labelWidth || state.form.state.labelWidth
+    const labelWidth = props.labelWidth || state.form?.state?.labelWidth
 
     if (labelWidth) {
       result.width = labelWidth
@@ -103,7 +103,7 @@ export const computedValueStyle =
       return result
     }
 
-    const labelWidth = props.labelWidth || state.form.state.labelWidth
+    const labelWidth = props.labelWidth || state.form?.state?.labelWidth
 
     if (labelWidth) {
       if (labelWidth === 'auto') {
@@ -231,7 +231,7 @@ export const getPropByPath = (obj: object, path: string, strict?: boolean) => {
 export const computedFieldValue =
   ({ props, state }: Pick<IFormItemRenderlessParams, 'props' | 'state'>) =>
   () => {
-    const model = state.form.model
+    const model = state.form?.model
 
     if (!model || !props.prop) {
       return
@@ -287,7 +287,6 @@ export const validate =
     state.validateState = VALIDATE_STATE.Validating
 
     const descriptor = {}
-
     if (rules && rules.length > 0) {
       rules.forEach((rule) => {
         delete rule.trigger
@@ -531,7 +530,7 @@ export const handleMouseenter =
 export const handleLabelMouseenter =
   ({ props, state, slots }) =>
   (e) => {
-    if (!state.form.overflowTitle || !state.form || slots.label) return
+    if (!state.form?.overflowTitle || !state.form || slots.label) return
     const label = e.target
     if (label && label.scrollWidth > label.offsetWidth) {
       state.form.showTooltip(label, props.label + state.form.labelSuffix)
diff --git a/packages/mobile/components/form-item/src/renderless/vue.ts b/packages/mobile/components/form-item/src/renderless/vue.ts
index ab6a608498..ccae14a7ab 100644
--- a/packages/mobile/components/form-item/src/renderless/vue.ts
+++ b/packages/mobile/components/form-item/src/renderless/vue.ts
@@ -110,7 +110,7 @@ const initState = ({
     formItemSize: computed(() => props.size || state.formSize),
     isDisplayOnly: computed(() => state.formInstance.displayOnly),
     labelPosition: computed(() => state.formInstance.labelPosition),
-    hideRequiredAsterisk: computed(() => state.formInstance.state.hideRequiredAsterisk),
+    hideRequiredAsterisk: computed(() => state.formInstance?.state?.hideRequiredAsterisk),
     labelSuffix: computed(() => state.formInstance.labelSuffix),
     labelWidth: computed(() => state.formInstance.labelWidth),
     showMessage: computed(() => state.formInstance.showMessage),
@@ -120,7 +120,7 @@ const initState = ({
     isErrorInline: computed(() => api.computedIsErrorInline()),
     isErrorBlock: computed(() => api.computedIsErrorBlock()),
     disabled: computed(() => state.formInstance.disabled),
-    tooltipType: computed(() => state.formInstance.state.tooltipType)
+    tooltipType: computed(() => state.formInstance?.state?.tooltipType)
   })
 
   return state
diff --git a/packages/mobile/components/input/src/input.ts b/packages/mobile/components/input/src/input.ts
index 883a052c5a..ff37b4883b 100644
--- a/packages/mobile/components/input/src/input.ts
+++ b/packages/mobile/components/input/src/input.ts
@@ -12,6 +12,22 @@
 import type { PropType } from '../../../vue-common'
 import type { ExtractPropTypes, ComputedRef } from 'vue'
 import type { ISharedRenderlessFunctionParams, ISharedRenderlessParamUtils } from '../../../types/shared.type'
+
+import type {
+  calculateNodeStyling,
+  calcTextareaHeight,
+  getInput,
+  handleInput,
+  calcIconOffset,
+  focus,
+  watchFormSelect,
+  setNativeInputValue,
+  resizeTextarea,
+  updateIconOffset,
+  hiddenPassword,
+  inputStyle
+} from './renderless'
+
 export type { ISharedRenderlessParamHooks } from '../../../types/shared.type'
 
 export const $constants = {
@@ -109,6 +125,10 @@ export const inputProps = {
     type: Boolean,
     default: false
   },
+  title: {
+    type: String,
+    default: ''
+  },
   showTitle: {
     type: Boolean,
     default: false
@@ -151,21 +171,6 @@ export const inputProps = {
   }
 }
 
-import type {
-  calculateNodeStyling,
-  calcTextareaHeight,
-  getInput,
-  handleInput,
-  calcIconOffset,
-  focus,
-  watchFormSelect,
-  setNativeInputValue,
-  resizeTextarea,
-  updateIconOffset,
-  hiddenPassword,
-  inputStyle
-} from './renderless'
-
 export interface IInputState {
   mode: string
   focused: boolean
diff --git a/packages/theme-mobile/src/form-item/index.less b/packages/theme-mobile/src/form-item/index.less
index ff0ee8f06d..b410eb6780 100644
--- a/packages/theme-mobile/src/form-item/index.less
+++ b/packages/theme-mobile/src/form-item/index.less
@@ -38,12 +38,12 @@
 
   &--medium &__content,
   &--medium &__label {
-    line-height: var(--ti-form-item-medium-line-height, 36px);
+    line-height: 36px;
   }
 
   &--small &__content,
   &--small &__label {
-    line-height: var(--ti-form-item-small-line-height, 28px);
+    line-height: 28px;
   }
 
   &--small &__error {
@@ -52,7 +52,7 @@
 
   &--mini &__content,
   &--mini &__label {
-    line-height: var(--ti-form-item-mini-line-height, 24px);
+    line-height: 24px;
   }
 
   &--mini &__error {
@@ -73,7 +73,7 @@
     vertical-align: middle;
     float: left;
     font-size: 16px;
-    color: var(--ti-form-item-label-color, #333);
+    color: var(--ti-mobile-form-item-label-color);
     line-height: 48px;
     padding-right: 8px;
     box-sizing: border-box;
@@ -90,7 +90,7 @@
   &__content {
     line-height: 48px;
     position: relative;
-    font-size: var(--ti-form-item-label-font-size, 14px);
+    font-size: 14px;
     .clearfix();
 
     .@{input-group-prefix-cls} {
@@ -118,8 +118,8 @@
   }
 
   &__error {
-    color: var(--ti-form-item-error-color, #f5222d);
-    font-size: var(--ti-form-item-error-font-size, 12px);
+    color: var(--ti-mobile-form-item-error-color);
+    font-size: 12px;
     line-height: 1;
     padding-top: 4px;
     position: absolute;
@@ -139,7 +139,7 @@
     .@{form-item-prefix-cls}__label-wrap > .@{form-item-prefix-cls}__label:before,
     .@{form-item-prefix-cls}__label:before {
       content: '*';
-      color: var(--ti-form-item-error-color, #f5222d);
+      color: var(--ti-mobile-form-item-error-color);
       margin-right: 4px;
     }
   }
@@ -149,7 +149,7 @@
     .@{input-prefix-cls}__inner:focus,
     .@{textarea-prefix-cls}__inner,
     .@{textarea-prefix-cls}__inner:focus {
-      border-color: var(--ti-form-item-error-color, #f5222d);
+      border-color: var(--ti-mobile-form-item-error-color);
     }
 
     .@{input-group-prefix-cls}__append,
@@ -160,13 +160,13 @@
     }
 
     .@{input-prefix-cls}__validateIcon {
-      color: var(--ti-form-item-error-color, #f5222d);
+      color: var(--ti-mobile-form-item-error-color);
     }
 
     .@{numeric-prefix-cls}__input-inner {
       &,
       &:focus {
-        border-color: var(--ti-form-item-error-color, #f5222d);
+        border-color: var(--ti-mobile-form-item-error-color);
       }
     }
   }
diff --git a/packages/theme-mobile/src/form-item/vars.less b/packages/theme-mobile/src/form-item/vars.less
index 716675c065..86967db1ff 100644
--- a/packages/theme-mobile/src/form-item/vars.less
+++ b/packages/theme-mobile/src/form-item/vars.less
@@ -1,10 +1,10 @@
 .component-css-vars-form-item() {
-  --ti-form-item-small-line-height: 28px;
-  --ti-form-item-medium-line-height: 36px;
-  --ti-form-item-mini-line-height: 24px;
-  --ti-form-item-label-line-height: var(--ti-mobile-base-size-height-minor, 30px);
-  --ti-form-item-label-font-size: 14px;
-  --ti-form-item-label-color: var(--ti-mobile-base-color-info-normal, #333);
-  --ti-form-item-error-color: var(--ti-mobile-base-color-danger-normal, #f5222d);
-  --ti-form-item-error-font-size: var(--ti-mobile-base-font-size, 12px);
+  // --ti-form-item-small-line-height: 28px;
+  // --ti-form-item-medium-line-height: 36px;
+  // --ti-form-item-mini-line-height: 24px;
+  // --ti-form-item-label-line-height: var(--ti-mobile-base-size-height-minor, 30px);
+  // --ti-form-item-label-font-size: 14px;
+  --ti-mobile-form-item-label-color: #333;
+  --ti-mobile-form-item-error-color: #f5222d;
+  // --ti-form-item-error-font-size: var(--ti-mobile-base-font-size, 12px);
 }
diff --git a/packages/theme-mobile/src/form/index.less b/packages/theme-mobile/src/form/index.less
index 8cd0acaca0..25e31cd633 100644
--- a/packages/theme-mobile/src/form/index.less
+++ b/packages/theme-mobile/src/form/index.less
@@ -52,7 +52,7 @@
     }
 
     .@{form-item-prefix-cls} {
-      margin-right: var(--ti-form-item-margin-right, 10px);
+      margin-right: 10px;
     }
 
     .@{form-item-prefix-cls}__label {

From 806938bf116944257f33b963a88e32bb7ee5dc07 Mon Sep 17 00:00:00 2001
From: Gimmy <975402925@qq.com>
Date: Tue, 10 Dec 2024 15:50:37 +0800
Subject: [PATCH 2/3] fix: fix mobile form-item error

---
 .../components/form-item/src/mobile.vue       | 123 +++---------------
 .../form-item/src/renderless/index.ts         |  50 +++----
 .../form-item/src/renderless/vue.ts           |   3 -
 .../components/form/src/renderless/vue.ts     |   2 +-
 4 files changed, 34 insertions(+), 144 deletions(-)

diff --git a/packages/mobile/components/form-item/src/mobile.vue b/packages/mobile/components/form-item/src/mobile.vue
index e7fecfe783..4222b1b760 100644
--- a/packages/mobile/components/form-item/src/mobile.vue
+++ b/packages/mobile/components/form-item/src/mobile.vue
@@ -10,7 +10,7 @@
  *
  -->
 <script lang="tsx">
-import { $prefix, setup, parseVnode, h, defineComponent, isVue2, hooks } from '../../../vue-common'
+import { $prefix, setup, parseVnode, h, defineComponent, isVue2 } from '../../../vue-common'
 import { renderless, api } from './renderless/vue'
 import LabelWrap from './label-wrap'
 import Tooltip from '../../tooltip'
@@ -49,14 +49,14 @@ export default defineComponent({
       handleMouseleave
     } = this as unknown as IFormItemInstance
 
-    const { validateIcon, isErrorInline, isErrorBlock, tooltipType } = state
-    const isMobile = state.mode === 'mobile'
+    const { validateIcon, isErrorInline, isErrorBlock, formInstance } = state
+    const isMobile = true
     const classPrefix = isMobile ? 'tiny-mobile-' : 'tiny-'
     const labelSlot = slots.label ? slots.label() : null
     const defaultSlots = slots.default ? slots.default() : null
     const errorSlot = scopedSlots.error && scopedSlots.error(state.validateMessage)
     const formItemClass = `${classPrefix}form-item--${state.sizeClass ? state.sizeClass : 'default'}`
-    const isShowError = state.validateState === 'error' && showMessage && state.form.showMessage
+    const isShowError = state.validateState === 'error' && showMessage && formInstance.showMessage
     const validateTag = state.formInstance && state.formInstance.validateTag
     let validateMessage
 
@@ -104,100 +104,15 @@ export default defineComponent({
       : null
 
     const getFormItemContnet = () => {
-      if (isMobile) {
-        const validatePosition = this.validatePosition || state.formInstance.validatePosition || 'right'
-        validateMessage = state.validateMessage ? (
-          validatePosition === 'right' ? (
-            <div class="tiny-mobile-input-form__error align-right">{state.validateMessage}</div>
-          ) : (
-            <div class="tiny-mobile-input-form__error align-left">{state.validateMessage}</div>
-          )
-        ) : null
-        return ItemContent
-      }
-
-      const tooltipTriggerContent =
-        ItemContent.length > 1
-          ? h('div', { class: 'tiny-form-item__content-muti-children' }, ItemContent)
-          : ItemContent[0]
-
-      if (!this.showMessage) {
-        return tooltipTriggerContent
-      }
-
-      const formAppendToBody = state.formInstance && state.formInstance.appendToBody
-      const appendToBody =
-        typeof this.appendToBody === 'boolean'
-          ? this.appendToBody
-          : typeof formAppendToBody === 'boolean'
-            ? formAppendToBody
-            : true
-      const validatePosition =
-        this.validatePosition || (state.formInstance && state.formInstance.validatePosition) || 'top-end'
-
-      const popperOptions = {
-        ...state.formInstance.popperOptions,
-        ...this.popperOptions,
-        forceAbsolute: !appendToBody,
-        onUpdate: (options) => {
-          const popper = options.instance._popper
-          const translate3d = popper.style.transform
-          const matchTranslate = translate3d.match(/translate3d\((\w+)px, (\w+)px, (\w+)px\)/)
-
-          if (!Array.isArray(matchTranslate)) {
-            return
-          }
-
-          const [x, y, z] = matchTranslate.slice(1)
-
-          popper.style.transform = `translate3d(${x}px, ${parseInt(y, 10)}px, ${z}px)`
-        }
-      }
-      const validateIconNode = validateIcon ? h(validateIcon, { class: 'tooltip-validate-icon' }) : null
-      return h(
-        'tooltip',
-        {
-          props: {
-            popperClass: `${classPrefix}form__valid`,
-            arrowOffset: 0,
-            adjustArrow: true,
-            type: tooltipType,
-            disabled: state.getValidateType !== 'tip',
-            placement: validatePosition,
-            manual: true,
-            appendToBody,
-            popperOptions,
-            modelValue: isShowError ? state.canShowTip : false,
-            zIndex: 'relative',
-            renderContent() {
-              let tooltipContent
-              if (errorSlot) {
-                tooltipContent = [errorSlot]
-              } else {
-                tooltipContent = [
-                  validateIconNode,
-                  <span class={`${classPrefix}form-item__validate-message`}>{state.validateMessage}</span>
-                ]
-              }
-
-              return tooltipContent
-            }
-          },
-          on: {
-            'update:modelValue': (value) => {
-              state.canShowTip = value
-            }
-          },
-          ref: 'tooltip'
-        },
-        [
-          !isVue2 && tooltipTriggerContent.type === hooks.Text ? (
-            <span>{tooltipTriggerContent}</span>
-          ) : (
-            tooltipTriggerContent
-          )
-        ]
-      )
+      const validatePosition = this.validatePosition || state.formInstance.validatePosition || 'right'
+      validateMessage = state.validateMessage ? (
+        validatePosition === 'right' ? (
+          <div class="tiny-mobile-input-form__error align-right">{state.validateMessage}</div>
+        ) : (
+          <div class="tiny-mobile-input-form__error align-left">{state.validateMessage}</div>
+        )
+      ) : null
+      return ItemContent
     }
 
     const FormItemContnet = ItemContent ? getFormItemContnet() : null
@@ -227,7 +142,7 @@ export default defineComponent({
       {
         props: {
           isAutoWidth: state.labelStyle && state.labelStyle.width === 'auto',
-          updateAll: state.form?.labelWidth === 'auto',
+          updateAll: state.formInstance?.labelWidth === 'auto',
           isMobile: state.mode === 'mobile'
         }
       },
@@ -249,7 +164,7 @@ export default defineComponent({
                   mouseleave: handleMouseleave
                 }
               },
-              labelSlot || label + (state.form?.labelSuffix || '')
+              labelSlot || label + (state.formInstance?.labelSuffix || '')
             )
           : null
       ]
@@ -283,7 +198,6 @@ export default defineComponent({
         }
       },
       [
-        !isMobile ? LabelContent : null,
         h(
           'div',
           {
@@ -294,9 +208,9 @@ export default defineComponent({
             style: !isMobile && state.contentStyle
           },
           [
-            isMobile ? LabelContent : null,
+            LabelContent,
             FormItemContnet,
-            isMobile ? validateMessage : null,
+            validateMessage,
             h(
               'transition',
               {
@@ -305,8 +219,7 @@ export default defineComponent({
                 }
               },
               [ErrorContent]
-            ),
-            isMobile ? null : ExtraTip
+            )
           ]
         )
       ]
diff --git a/packages/mobile/components/form-item/src/renderless/index.ts b/packages/mobile/components/form-item/src/renderless/index.ts
index 5a98837db3..9231870cde 100644
--- a/packages/mobile/components/form-item/src/renderless/index.ts
+++ b/packages/mobile/components/form-item/src/renderless/index.ts
@@ -18,7 +18,6 @@ import { isNull } from '@opentiny/utils/type'
 import debounce from '@opentiny/utils/deps/debounce'
 import type {
   IFormItemRenderlessParams,
-  IFormInstance,
   IFormItemDisplayedValueParam,
   IFormItemRule,
   IFormItemTrigger,
@@ -80,11 +79,11 @@ export const computedLabelStyle =
   (): IFormItemLabelStyle => {
     const result = { width: '' }
 
-    if (state.form?.labelPosition === POSITION.Top) {
+    if (state.formInstance?.labelPosition === POSITION.Top) {
       return result
     }
 
-    const labelWidth = props.labelWidth || state.form?.state?.labelWidth
+    const labelWidth = props.labelWidth || state.formInstance?.state?.labelWidth
 
     if (labelWidth) {
       result.width = labelWidth
@@ -98,12 +97,12 @@ export const computedValueStyle =
   (): { width: string } => {
     const result = { width: '' }
 
-    if (state.form?.labelPosition === POSITION.Top) {
+    if (state.formInstance?.labelPosition === POSITION.Top) {
       result.width = '100%'
       return result
     }
 
-    const labelWidth = props.labelWidth || state.form?.state?.labelWidth
+    const labelWidth = props.labelWidth || state.formInstance?.state?.labelWidth
 
     if (labelWidth) {
       if (labelWidth === 'auto') {
@@ -122,7 +121,7 @@ export const computedContentStyle =
     const result: StyleValue = {}
     const label = props.label
 
-    if (state.form.labelPosition === POSITION.Top || state.form.inline) {
+    if (state.formInstance.labelPosition === POSITION.Top || state.formInstance.inline) {
       return result
     }
 
@@ -130,12 +129,12 @@ export const computedContentStyle =
       return result
     }
 
-    const labelWidth = props.labelWidth || state.form.state.labelWidth
+    const labelWidth = props.labelWidth || state.formInstance.state.labelWidth
 
     if (labelWidth === 'auto') {
       if (props.labelWidth === 'auto') {
         result.marginLeft = state.computedLabelWidth
-      } else if (state.form.state.labelWidth === 'auto') {
+      } else if (state.formInstance.state.labelWidth === 'auto') {
         result.marginLeft = state.formInstance.state.autoLabelWidth
       }
     } else {
@@ -145,25 +144,6 @@ export const computedContentStyle =
     return result
   }
 
-export const computedForm =
-  ({ constants, vm, state }: Pick<IFormItemRenderlessParams, 'constants' | 'vm' | 'state'>) =>
-  (): IFormInstance | null => {
-    const { FORM_NAME, FORM_ITEM_NAME } = constants
-    let parent = vm.$parent?.$parent as IFormInstance | null
-    let parentName = parent?.$options?.componentName
-
-    while (parent && parentName !== FORM_NAME) {
-      if (parentName === FORM_ITEM_NAME) {
-        state.isNested = true
-      }
-
-      parent = parent?.$parent as IFormInstance | null
-      parentName = parent?.$options?.componentName
-    }
-
-    return parent
-  }
-
 export const computedIsRequired =
   ({ api, state }: Pick<IFormItemRenderlessParams, 'api' | 'state'>) =>
   (): boolean => {
@@ -231,7 +211,7 @@ export const getPropByPath = (obj: object, path: string, strict?: boolean) => {
 export const computedFieldValue =
   ({ props, state }: Pick<IFormItemRenderlessParams, 'props' | 'state'>) =>
   () => {
-    const model = state.form?.model
+    const model = state.formInstance?.model
 
     if (!model || !props.prop) {
       return
@@ -337,7 +317,7 @@ export const resetField =
     state.validateState = ''
     state.validateMessage = ''
 
-    let model = state.form.model || {}
+    let model = state.formInstance.model || {}
     let value = state.fieldValue
     let path = props.prop || ''
 
@@ -371,7 +351,7 @@ export const resetField =
 export const getRules =
   ({ props, state }: Pick<IFormItemRenderlessParams, 'props' | 'state'>) =>
   (): IFormItemRule[] => {
-    let formRules = state.form?.rules || {}
+    let formRules = state.formInstance?.rules || {}
     const selfRules = props.rules as IFormItemRule[]
     const requiredRule = props.required !== undefined ? { required: Boolean(props.required) } : []
     const prop = getPropByPath(formRules, props.prop || '')
@@ -506,7 +486,7 @@ export const wrapValidate = ({
 export const handleMouseenter =
   ({ state }: Pick<IFormItemRenderlessParams, 'state'>) =>
   (e): void => {
-    if (!state.isDisplayOnly || !state.typeName || !state.form) return
+    if (!state.isDisplayOnly || !state.typeName || !state.formInstance) return
     const dom = e.target
     const text = dom.textContent
     const font = window.getComputedStyle(dom).font
@@ -523,22 +503,22 @@ export const handleMouseenter =
     }
 
     if (res.o || overHeight) {
-      state.form.showTooltip(dom, state.displayedValue)
+      state.formInstance.showTooltip(dom, state.displayedValue)
     }
   }
 
 export const handleLabelMouseenter =
   ({ props, state, slots }) =>
   (e) => {
-    if (!state.form?.overflowTitle || !state.form || slots.label) return
+    if (!state.formInstance?.overflowTitle || !state.formInstance || slots.label) return
     const label = e.target
     if (label && label.scrollWidth > label.offsetWidth) {
-      state.form.showTooltip(label, props.label + state.form.labelSuffix)
+      state.formInstance.showTooltip(label, props.label + state.formInstance.labelSuffix)
     }
   }
 
 export const handleMouseleave = (state: IFormItemRenderlessParams['state']) => (): void => {
-  state.form && state.form.hideTooltip()
+  state.formInstance && state.formInstance.hideTooltip()
 }
 
 export const getDisplayedValue =
diff --git a/packages/mobile/components/form-item/src/renderless/vue.ts b/packages/mobile/components/form-item/src/renderless/vue.ts
index ccae14a7ab..612765378c 100644
--- a/packages/mobile/components/form-item/src/renderless/vue.ts
+++ b/packages/mobile/components/form-item/src/renderless/vue.ts
@@ -28,7 +28,6 @@ import {
   computedLabelStyle,
   computedValueStyle,
   computedContentStyle,
-  computedForm,
   computedIsRequired,
   computedFieldValue,
   computedGetValidateType,
@@ -102,7 +101,6 @@ const initState = ({
     labelStyle: computed(() => api.computedLabelStyle()),
     valueStyle: computed(() => api.computedValueStyle()),
     contentStyle: computed(() => api.computedContentStyle()),
-    form: computed(() => api.computedForm() as IFormInstance),
     fieldValue: computed(() => api.computedFieldValue()),
     isRequired: computed(() => api.computedIsRequired()),
     formInline: computed(() => state.formInstance.inline),
@@ -137,7 +135,6 @@ const initApi = ({ api, state, dispatch, broadcast, props, constants, vm, t, nex
     computedLabelStyle: computedLabelStyle({ props, state }),
     computedValueStyle: computedValueStyle({ props, state }),
     computedContentStyle: computedContentStyle({ props, state }),
-    computedForm: computedForm({ constants, vm, state }),
     computedFieldValue: computedFieldValue({ props, state }),
     computedGetValidateType: computedGetValidateType({ props, state }),
     computedValidateIcon: computedValidateIcon({ props, state }),
diff --git a/packages/mobile/components/form/src/renderless/vue.ts b/packages/mobile/components/form/src/renderless/vue.ts
index 15ef761c7a..d70a4d9beb 100644
--- a/packages/mobile/components/form/src/renderless/vue.ts
+++ b/packages/mobile/components/form/src/renderless/vue.ts
@@ -108,7 +108,7 @@ export const renderless = (
 
   api.created()
 
-  provide('form', parent)
+  provide('form', vm)
 
   provide('showAutoWidth', state.showAutoWidth)
 

From 3da5287f8910cd1a18b84d0f0786520470c676ab Mon Sep 17 00:00:00 2001
From: James-9696 <hujm969696@163.com>
Date: Wed, 11 Dec 2024 01:31:08 -0800
Subject: [PATCH 3/3] fix: delete unless code

---
 packages/theme-mobile/src/form-item/vars.less | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/packages/theme-mobile/src/form-item/vars.less b/packages/theme-mobile/src/form-item/vars.less
index 86967db1ff..95e7e92ab5 100644
--- a/packages/theme-mobile/src/form-item/vars.less
+++ b/packages/theme-mobile/src/form-item/vars.less
@@ -1,10 +1,4 @@
 .component-css-vars-form-item() {
-  // --ti-form-item-small-line-height: 28px;
-  // --ti-form-item-medium-line-height: 36px;
-  // --ti-form-item-mini-line-height: 24px;
-  // --ti-form-item-label-line-height: var(--ti-mobile-base-size-height-minor, 30px);
-  // --ti-form-item-label-font-size: 14px;
   --ti-mobile-form-item-label-color: #333;
   --ti-mobile-form-item-error-color: #f5222d;
-  // --ti-form-item-error-font-size: var(--ti-mobile-base-font-size, 12px);
 }