chore: 优化组件 provide/inject 使用 (#3027)

src/packages/__VUE/audio/index.vue

@@ -64,7 +64,7 @@ import { toRefs, ref, onMounted, reactive, watch, provide, type PropType } from
 import { createComponent } from '@/packages/utils/create'
 import { Service } from '@nutui/icons-vue'
 import NutRange from '../range/index.vue'
-import type { AudioType } from './types'
+import { AUDIO_KEY, type AudioType } from './types'
 const { create } = createComponent('audio')
 
 export default create({
@@ -257,7 +257,7 @@ export default create({
       }
     )
 
-    provide('audioParent', {
+    provide(AUDIO_KEY, {
       children: [],
       props,
       audioData,

src/packages/__VUE/audio/types.ts

@@ -1 +1,3 @@
 export type AudioType = 'progress' | 'icon' | 'controls' | 'none'
+export type AudioOperateType = 'play' | 'back' | 'forward' | 'mute'
+export const AUDIO_KEY = Symbol('nut-audio')

src/packages/__VUE/audiooperate/index.vue

@@ -32,7 +32,7 @@ import { toRefs, ref, useSlots, reactive, inject, type PropType } from 'vue'
 import { createComponent } from '@/packages/utils/create'
 import NutButton from '../button'
 import { useLocale } from '@/packages/utils/useLocale'
-import type { AudioOperateType } from './types'
+import { type AudioOperateType, AUDIO_KEY } from '../audio/types'
 
 const { create } = createComponent('audio-operate')
 const cN = 'NutAudioOperate'
@@ -52,7 +52,7 @@ export default create({
 
   setup(props) {
     const translate = useLocale(cN)
-    const audio: any = inject('audioParent')
+    const audio: any = inject(AUDIO_KEY)
     const parent: {
       children: []
       audioData: any

src/packages/__VUE/form/common.ts

@@ -4,6 +4,7 @@ import type { ComputedRef, Ref } from 'vue'
 
 export const FORM_KEY = Symbol('nut-form')
 export const FORM_DISABLED_KEY = Symbol('nut-form-disabled')
+export const FORM_TIP_KEY = Symbol('nut-form-tip')
 
 export const useFormDisabled = (disabled: Ref<boolean>): ComputedRef<boolean> => {
   const { parent } = useParent(FORM_DISABLED_KEY)

src/packages/__VUE/form/form.taro.vue

@@ -10,7 +10,7 @@ import { reactive, computed, provide, watch } from 'vue'
 import { useChildren, getPropByPath, isPromise } from '@/packages/utils'
 import NutCellGroup from '../cellgroup/index.taro'
 import type { FormErrorMessage, FormLabelPosition, FormRule, FormRules, FormStarPosition, FormItemRule } from './types'
-import { FORM_KEY, FORM_DISABLED_KEY } from './common'
+import { FORM_KEY, FORM_DISABLED_KEY, FORM_TIP_KEY } from './common'
 
 defineOptions({
   name: 'NutForm'
@@ -42,7 +42,7 @@ linkChildren2({ props })
 
 const formErrorTip = computed(() => reactive<any>({}))
 
-provide('formErrorTip', formErrorTip)
+provide(FORM_TIP_KEY, formErrorTip)
 const clearErrorTips = () => {
   Object.keys(formErrorTip.value).forEach((item) => {
     formErrorTip.value[item] = ''

src/packages/__VUE/form/form.vue

@@ -10,7 +10,7 @@ import { reactive, computed, provide, watch } from 'vue'
 import { useChildren, getPropByPath, isPromise } from '@/packages/utils'
 import NutCellGroup from '../cellgroup'
 import type { FormErrorMessage, FormLabelPosition, FormRule, FormRules, FormStarPosition, FormItemRule } from './types'
-import { FORM_KEY, FORM_DISABLED_KEY } from './common'
+import { FORM_KEY, FORM_DISABLED_KEY, FORM_TIP_KEY } from './common'
 
 defineOptions({
   name: 'NutForm'
@@ -42,7 +42,7 @@ linkChildren2({ props })
 
 const formErrorTip = computed(() => reactive<any>({}))
 
-provide('formErrorTip', formErrorTip)
+provide(FORM_TIP_KEY, formErrorTip)
 const clearErrorTips = () => {
   Object.keys(formErrorTip.value).forEach((item) => {
     formErrorTip.value[item] = ''

src/packages/__VUE/formitem/form-item.taro.vue

@@ -28,7 +28,7 @@ import { pxCheck } from '@/packages/utils/pxCheck'
 import { computed, inject, CSSProperties } from 'vue'
 import type { FormItemRule, FormLabelPosition, FormStarPosition } from '../form/types'
 import NutCell from '../cell/index.taro'
-import { FORM_KEY } from '../form/common'
+import { FORM_KEY, FORM_TIP_KEY } from '../form/common'
 import { useParent } from '@/packages/utils'
 
 defineOptions({
@@ -84,7 +84,7 @@ const starPositionClass = computed(() => {
   return position !== 'left' ? `nut-form-item__star-${position}` : ''
 })
 
-const parent = inject('formErrorTip') as any
+const parent = inject(FORM_TIP_KEY) as any
 
 const labelStyle = computed(() => {
   return {

src/packages/__VUE/formitem/form-item.vue

@@ -28,7 +28,7 @@ import { pxCheck } from '@/packages/utils/pxCheck'
 import { computed, inject, CSSProperties } from 'vue'
 import type { FormItemRule, FormLabelPosition, FormStarPosition } from '../form/types'
 import NutCell from '../cell'
-import { FORM_KEY } from '../form/common'
+import { FORM_KEY, FORM_TIP_KEY } from '../form/common'
 import { useParent } from '@/packages/utils'
 
 defineOptions({
@@ -84,7 +84,7 @@ const starPositionClass = computed(() => {
   return position !== 'left' ? `nut-form-item__star-${position}` : ''
 })
 
-const parent = inject('formErrorTip') as any
+const parent = inject(FORM_TIP_KEY) as any
 
 const labelStyle = computed(() => {
   return {

src/packages/__VUE/tabpane/index.taro.vue

@@ -6,6 +6,7 @@
 <script lang="ts">
 import { computed, CSSProperties, inject } from 'vue'
 import { createComponent } from '@/packages/utils/create'
+import { TABS_KEY } from '../tabs/types'
 const { create } = createComponent('tab-pane')
 
 export default create({
@@ -25,7 +26,7 @@ export default create({
   },
   emits: ['click'],
   setup(props) {
-    const parentOption = inject('tabsOpiton') as any
+    const parentOption = inject(TABS_KEY) as any
     const paneStyle = computed(() => {
       return {
         display:

src/packages/__VUE/tabpane/index.vue

@@ -6,6 +6,7 @@
 <script lang="ts">
 import { computed, CSSProperties, inject } from 'vue'
 import { createComponent } from '@/packages/utils/create'
+import { TABS_KEY } from '../tabs/types'
 const { create } = createComponent('tab-pane')
 
 export default create({
@@ -25,7 +26,7 @@ export default create({
   },
   emits: ['click'],
   setup(props) {
-    const parentOption = inject('tabsOpiton') as any
+    const parentOption = inject(TABS_KEY) as any
     const paneStyle = computed(() => {
       return {
         display:

src/packages/__VUE/tabs/index.taro.vue

@@ -74,7 +74,7 @@ import { TypeOfFun } from '@/packages/utils/util'
 import raf from '@/packages/utils/raf'
 import { useTabContentTouch } from './hooks'
 import { useTaroRect } from '@/packages/utils/useTaroRect'
-import type { RectItem, TabsDirection, TabsSize, TabsType, TabsAlign } from './types'
+import { type RectItem, type TabsDirection, type TabsSize, type TabsType, type TabsAlign, TABS_KEY } from './types'
 
 export class Title {
   title = ''
@@ -158,7 +158,7 @@ export default create({
   setup(props, { emit, slots }: any) {
     const refRandomId = Math.random().toString(36).slice(-8)
     const container = ref(null)
-    provide('tabsOpiton', {
+    provide(TABS_KEY, {
       activeKey: computed(() => props.modelValue || '0'),
       autoHeight: computed(() => props.autoHeight),
       animatedTime: computed(() => props.animatedTime)

src/packages/__VUE/tabs/index.vue

@@ -103,7 +103,7 @@ import { TypeOfFun } from '@/packages/utils/util'
 import { useRect } from '@/packages/utils/useRect'
 import raf from '@/packages/utils/raf'
 import { useTabContentTouch } from './hooks'
-import type { TabsDirection, TabsSize, TabsType, TabsAlign } from './types'
+import { type TabsDirection, type TabsSize, type TabsType, type TabsAlign, TABS_KEY } from './types'
 
 export class Title {
   title = ''
@@ -184,7 +184,7 @@ export default create({
   setup(props, { emit, slots }: any) {
     const container = ref<any>(null)
     let stickyFixed: boolean
-    provide('tabsOpiton', {
+    provide(TABS_KEY, {
       activeKey: computed(() => props.modelValue || '0'),
       autoHeight: computed(() => props.autoHeight),
       animatedTime: computed(() => props.animatedTime)

src/packages/__VUE/tabs/types.ts

@@ -12,3 +12,4 @@ export type TabsDirection = 'horizontal' | 'vertical'
 export type TabsSize = 'large' | 'normal' | 'small'
 export type TabsType = 'line' | 'smile'
 export type TabsAlign = 'left' | 'center'
+export const TABS_KEY = Symbol('nut-tab')