网上有不少文章给出了Composition代替Minix的方式和优点，但是本人没有找到如何方法中使用props。下面的例子给出了link作为composition如何在cell中使用

link minix

import { computed, toRefs } from 'vue'

export default function (instance: any, props: any): any {
  const { to, replace, target, append } = toRefs(props)

  const router = instance?.appContext.config.globalProperties.$router

  const linkUrl = computed(() => {
    const type = typeof to?.value
    if (type !== 'string') {
      return null
    }
    if ((to?.value as string).includes('//')) {
      /* Absolute URL, we do not need to route this */
      return to?.value
    }

    if (router) {
      const current = router.currentRoute
      const route = router.resolve(to?.value, current, append.value)
      return route ? route.href : to?.value
    }
    return to?.value
  })

  const handleClick = (newWindow = false) => {
    if (newWindow) {
      let toOpen = to?.value

      if (router) {
        const current = router.currentRoute
        const route = router.resolve(to?.value, current, append.value)
        toOpen = route ? route.href : to?.value
      }
      window.open(toOpen as string)
    } else {
      if (router) {
        if ((typeof to?.value === 'string') && to.value.includes('//')) {
          window.location.href = to.value
        } else {
          replace.value ? router.replace(to?.value) : router.push(to?.value)
        }
      } else {
        window.location.href = to?.value as string
      }
    }
  }

  const handleCheckClick = (event: any, newWindow = false) => {
    if (to?.value) {
      if (target.value === '_blank') {
        return false
      } else {
        event.preventDefault()
        handleClick(newWindow)
      }
    }
  }

  return {
    linkUrl,
    handleClick,
    handleCheckClick
  }
}

cell

<template>
    <div :class="classes">
        <a
            v-if="to"
            :href="linkUrl"
            :target="target"
            class="ivu-cell-link"
            @click.exact="handleClickItem($event, false)"
            @click.ctrl="handleClickItem($event, true)"
            @click.meta="handleClickItem($event, true)">
            <CellItem :title="title" :label="label" :extra="extra">
                <template v-slot:icon><slot name="icon"></slot></template>
                 <template v-slot:default><slot name="default"></slot></template>
                <template v-slot:extra><slot name="extra"></slot></template>
                <template v-slot:label><slot name="label"></slot></template>
            </CellItem>
        </a>
        <div class="ivu-cell-link" v-else @click="handleClickItem">
            <CellItem :title="title" :label="label" :extra="extra">
                <slot name="icon"></slot>
                <slot name="default"></slot>
                <template v-slot:extra><slot></slot></template>
                <slot name="label"></slot>
            </CellItem>
        </div>
        <div class="ivu-cell-arrow" v-if="to">
            <slot name="arrow">
                <Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" />
            </slot>
        </div>
    </div>
</template>
<script lang="ts">
import { computed, defineComponent, getCurrentInstance, inject, PropType, ref, toRefs } from 'vue'
import CellItem from './cell-item.vue'
import Icon from '../icon'
import link from '../../mixins/link'

const prefixClass = 'ivu-cell'

export default defineComponent({
  name: 'Cell',
  inject: ['cellGroup'],
  components: { CellItem, Icon },
  props: {
    to: {
      type: [Object, String]
    },
    replace: {
      type: Boolean,
      default: false
    },
    target: {
      type: String as PropType<'_blank' | '_self' | '_parent' | '_top'>,
      default: '_self'
    },
    append: {
      type: Boolean,
      required: false,
      default: false
    },
    name: {
      type: [String, Number]
    },
    title: {
      type: String,
      default: ''
    },
    label: {
      type: String,
      default: ''
    },
    extra: {
      type: String,
      default: ''
    },
    disabled: {
      type: Boolean,
      default: false
    },
    selected: {
      type: Boolean,
      default: false
    }
  },
  setup (props, ctx) {
    const instance = getCurrentInstance()
    const { to } = toRefs(props)

    const { linkUrl, handleClick, handleCheckClick } = link(instance, props)

    const cellGroup = inject<any>('cellGroup')

    const { name, disabled, selected } = toRefs(props)

    const prefixCls = ref(prefixClass)

    const classes = computed(() => {
      return [
                    `${prefixCls.value}`,
                    {
                      [`${prefixCls.value}-disabled`]: disabled.value,
                      [`${prefixCls.value}-selected`]: selected.value,
                      [`${prefixCls.value}-with-link`]: to?.value
                    }
      ]
    })
    const arrowType = computed(() => {
      return 'ios-arrow-forward'
    })
    const customArrowType = computed(() => {
      return ''
    })
    const arrowSize = computed(() => {
      return ''
    })

    const handleClickItem = (event: any, newWindow: boolean) => {
      cellGroup.ctx.handleClick(name?.value)

      handleCheckClick(event, newWindow)
    }

    return {
      linkUrl,
      handleClick,
      handleCheckClick,
      prefixCls,
      classes,
      arrowType,
      customArrowType,
      arrowSize,
      handleClickItem
    }
  }
})
</script>