@blueking/vxe-table/packages/table/src/use/cell-view.ts

一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...

import { computed } from 'vue'
import XEUtils from 'xe-utils'

import type { VxeTableDefines, VxeGlobalRendererHandles } from '../../../../types'

export function useCellView <D = any, P = Record<string, any>> (props: {
  renderOpts: VxeGlobalRendererHandles.RenderTableCellOptions | VxeGlobalRendererHandles.RenderTableEditOptions
  renderParams: VxeGlobalRendererHandles.RenderTableCellParams | VxeGlobalRendererHandles.RenderTableEditParams
}) {
  const currColumn = computed<VxeTableDefines.ColumnInfo<D>>(() => {
    const { renderParams } = props
    return renderParams.column
  })

  const currRow = computed<D>(() => {
    const { renderParams } = props
    return renderParams.row
  })

  const cellOptions = computed<P>(() => {
    const { renderOpts } = props
    return renderOpts.props as any || {}
  })

  const cellModel = computed({
    get () {
      const { renderParams } = props
      const { row, column } = renderParams
      return XEUtils.get(row, column.field)
    },
    set (value) {
      const { renderParams } = props
      const { row, column } = renderParams
      return XEUtils.set(row, column.field, value)
    }
  })

  return {
    currColumn,
    currRow,
    cellModel,
    cellOptions
  }
}