vxe-pc-ui 3.0.1 → 3.0.2

package/packages/form/render/index.ts

@@ -0,0 +1,499 @@
+import { CreateElement } from 'vue'
+import XEUtils from 'xe-utils'
+import { renderer } from '../../ui'
+import { getOnName, getModelEvent, getChangeEvent } from '../../ui/src/vn'
+import { errLog } from '../../ui/src/log'
+
+const componentDefaultModelProp = 'value'
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function getOldComponentName (name: string) {
+  return `vxe-${name.replace('$', '')}`
+}
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function getOldComponent ({ name }: any) {
+  return getOldComponentName(name)
+}
+
+function getDefaultComponent ({ name }: any) {
+  return name
+}
+
+function getNativeAttrs (renderOpts: any) {
+  let { name, attrs } = renderOpts
+  if (name === 'input') {
+    attrs = Object.assign({ type: 'text' }, attrs)
+  }
+  return attrs
+}
+
+function getComponentFormItemProps (renderOpts: any, params: any, value: any, defaultProps?: any) {
+  return XEUtils.assign({}, defaultProps, renderOpts.props, { [componentDefaultModelProp]: value })
+}
+
+/**
+ * 原生事件处理
+ * @param renderOpts
+ * @param params
+ * @param modelFunc
+ * @param changeFunc
+ */
+function getElementOns (renderOpts: any, params: any, modelFunc?: any, changeFunc?: any) {
+  const { events } = renderOpts
+  const modelEvent = getModelEvent(renderOpts.name)
+  const changeEvent = getChangeEvent(renderOpts.name)
+  const isSameEvent = changeEvent === modelEvent
+  const ons: any = {}
+  if (events) {
+    XEUtils.objectEach(events, (func, key: any) => {
+      ons[getOnName(key)] = function (...args: any[]) {
+        func(params, ...args)
+      }
+    })
+  }
+  if (modelFunc) {
+    ons[getOnName(modelEvent)] = function (targetEvnt: any) {
+      modelFunc(targetEvnt)
+      if (isSameEvent && changeFunc) {
+        changeFunc(targetEvnt)
+      }
+      if (events && events[modelEvent]) {
+        events[modelEvent](params, targetEvnt)
+      }
+    }
+  }
+  if (!isSameEvent && changeFunc) {
+    ons[getOnName(changeEvent)] = function (...args: any[]) {
+      changeFunc(...args)
+      if (events && events[changeEvent]) {
+        events[changeEvent](params, ...args)
+      }
+    }
+  }
+  return ons
+}
+
+/**
+ * 组件事件处理
+ * @param renderOpts
+ * @param params
+ * @param modelFunc
+ * @param changeFunc
+ */
+function getComponentOns (renderOpts: any, params: any, modelFunc?: any, changeFunc?: any) {
+  const { events } = renderOpts
+  const modelEvent = getModelEvent(renderOpts.name)
+  const changeEvent = getChangeEvent(renderOpts.name)
+  const ons: any = {}
+  XEUtils.objectEach(events, (func, key: any) => {
+    ons[getOnName(key)] = function (...args: any[]) {
+      if (process.env.VUE_APP_VXE_ENV === 'development') {
+        if (!XEUtils.isFunction(func)) {
+          errLog('vxe.error.errFunc', [func])
+        }
+      }
+      func(params, ...args)
+    }
+  })
+  if (modelFunc) {
+    ons[getOnName(modelEvent)] = function (targetEvnt: any) {
+      modelFunc(targetEvnt)
+      if (events && events[modelEvent]) {
+        events[modelEvent](params, targetEvnt)
+      }
+    }
+  }
+  if (changeFunc) {
+    ons[getOnName(changeEvent)] = function (...args: any[]) {
+      changeFunc(...args)
+      if (events && events[changeEvent]) {
+        events[changeEvent](params, ...args)
+      }
+    }
+  }
+  return ons
+}
+
+function getItemOns (renderOpts: any, params: any) {
+  const { $form, data, field } = params
+  return getComponentOns(renderOpts, params, (value: any) => {
+    // 处理 model 值双向绑定
+    XEUtils.set(data, field, value)
+  }, () => {
+    // 处理 change 事件相关逻辑
+    $form.updateStatus(params)
+  })
+}
+
+function getNativeItemOns (renderOpts: any, params: any) {
+  const { $form, data, field } = params
+  return getElementOns(renderOpts, params, (evnt: any) => {
+    // 处理 model 值双向绑定
+    const itemValue = evnt.target.value
+    XEUtils.set(data, field, itemValue)
+  }, () => {
+    // 处理 change 事件相关逻辑
+    $form.updateStatus(params)
+  })
+}
+
+function renderNativeOptgroup (h: CreateElement, renderOpts: any, params: any, renderOptionsMethods: any) {
+  const { optionGroups, optionGroupProps = {} } = renderOpts
+  const groupOptions = optionGroupProps.options || 'options'
+  const groupLabel = optionGroupProps.label || 'label'
+  return optionGroups.map((group: any, gIndex: any) => {
+    return h('optgroup', {
+      key: gIndex,
+      attrs: {
+        label: group[groupLabel]
+      }
+    }, renderOptionsMethods(group[groupOptions], renderOpts, params))
+  })
+}
+
+/**
+ * 渲染表单-项
+ * 用于渲染原生的标签
+ */
+function nativeItemRender (h: CreateElement, renderOpts: any, params: any) {
+  const { data, field } = params
+  const { name } = renderOpts
+  const attrs = getNativeAttrs(renderOpts)
+  const itemValue = XEUtils.get(data, field)
+  return [
+    h(name, {
+      class: `vxe-default-${name}`,
+      attrs,
+      domProps: {
+        value: attrs && name === 'input' && (attrs.type === 'submit' || attrs.type === 'reset') ? null : itemValue
+      },
+      on: getNativeItemOns(renderOpts, params)
+    })
+  ]
+}
+
+function defaultItemRender (h: CreateElement, renderOpts: any, params: any) {
+  const { data, field } = params
+  const itemValue = XEUtils.get(data, field)
+  return [
+    h(getDefaultComponent(renderOpts), {
+      props: getComponentFormItemProps(renderOpts, params, itemValue),
+      on: getItemOns(renderOpts, params)
+    })
+  ]
+}
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function oldItemRender (h: CreateElement, renderOpts: any, params: any) {
+  const { data, field } = params
+  const itemValue = XEUtils.get(data, field)
+  return [
+    h(getOldComponent(renderOpts), {
+      props: getComponentFormItemProps(renderOpts, params, itemValue),
+      on: getItemOns(renderOpts, params)
+    })
+  ]
+}
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function oldButtonItemRender (h: CreateElement, renderOpts: any, params: any) {
+  return [
+    h('vxe-button', {
+      props: getComponentFormItemProps(renderOpts, params, null),
+      on: getComponentOns(renderOpts, params)
+    })
+  ]
+}
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function oldButtonsItemRender (h: CreateElement, renderOpts: any, params: any) {
+  return renderOpts.children.map((childRenderOpts: any) => oldButtonItemRender(h, childRenderOpts, params)[0])
+}
+
+/**
+ * 渲染原生的 select 标签
+ */
+function renderNativeFormOptions (h: CreateElement, options: any, renderOpts: any, params: any) {
+  const { data, field } = params
+  const { optionProps = {} } = renderOpts
+  const labelProp = optionProps.label || 'label'
+  const valueProp = optionProps.value || 'value'
+  const disabledProp = optionProps.disabled || 'disabled'
+  const cellValue = XEUtils.get(data, field)
+  return options.map((item: any, oIndex: any) => {
+    return h('option', {
+      key: oIndex,
+      props: {
+        value: item[valueProp],
+        disabled: item[disabledProp],
+        /* eslint-disable eqeqeq */
+        selected: item[valueProp] == cellValue
+      }
+    }, item[labelProp])
+  })
+}
+
+/**
+ * 渲染表单-项
+ */
+function defaultFormItemRender (h: CreateElement, renderOpts: any, params: any) {
+  const { data, field } = params
+  const itemValue = XEUtils.get(data, field)
+  return [
+    h(getDefaultComponent(renderOpts), {
+      props: getComponentFormItemProps(renderOpts, params, itemValue),
+      on: getItemOns(renderOpts, params)
+    })
+  ]
+}
+
+function formItemRadioAndCheckboxRender (h: CreateElement, renderOpts: any, params: any) {
+  const { options, optionProps } = renderOpts
+  const { data, field } = params
+  const itemValue = XEUtils.get(data, field)
+  return [
+    h(getDefaultComponent(renderOpts), {
+      props: {
+        options,
+        optionProps,
+        ...getComponentFormItemProps(renderOpts, params, itemValue)
+      },
+      on: getItemOns(renderOpts, params)
+    })
+  ]
+}
+
+/**
+ * 已废弃
+ * @deprecated
+ */
+function oldFormItemRadioAndCheckboxRender (h: CreateElement, renderOpts: any, params: any) {
+  const { name, options, optionProps = {} } = renderOpts
+  const { data, field } = params
+  const labelProp = optionProps.label || 'label'
+  const valueProp = optionProps.value || 'value'
+  const disabledProp = optionProps.disabled || 'disabled'
+  const itemValue = XEUtils.get(data, field)
+  const compName = getOldComponentName(name)
+  // 如果是分组
+  if (options) {
+    return [
+      h(`${compName}-group`, {
+        props: getComponentFormItemProps(renderOpts, params, itemValue),
+        on: getItemOns(renderOpts, params),
+        scopedSlots: {
+          default: () => {
+            return options.map((item: any, index: any) => {
+              return h(compName, {
+                key: index,
+                props: {
+                  label: item[valueProp],
+                  content: item[labelProp],
+                  disabled: item[disabledProp]
+                }
+              })
+            })
+          }
+        }
+      })
+    ]
+  }
+  return [
+    h(compName, {
+      props: getComponentFormItemProps(renderOpts, params, itemValue),
+      on: getItemOns(renderOpts, params)
+    })
+  ]
+}
+
+/**
+ * 表单 - 渲染器
+ */
+renderer.mixin({
+  input: {
+    renderItemContent: nativeItemRender
+  },
+  textarea: {
+    renderItemContent: nativeItemRender
+  },
+  select: {
+    renderItemContent (h: CreateElement, renderOpts: any, params: any) {
+      return [
+        h('select', {
+          class: 'vxe-default-select',
+          attrs: {
+            ...getNativeAttrs(renderOpts)
+          },
+          on: getNativeItemOns(renderOpts, params)
+        },
+        renderOpts.optionGroups ? renderNativeOptgroup(h, renderOpts, params, renderNativeFormOptions) : renderNativeFormOptions(h, renderOpts.options, renderOpts, params))
+      ]
+    }
+  },
+  VxeInput: {
+    renderItemContent: defaultItemRender
+  },
+  VxeNumberInput: {
+    renderItemContent: defaultItemRender
+  },
+  VxePasswordInput: {
+    renderItemContent: defaultItemRender
+  },
+  VxeTextarea: {
+    renderItemContent: defaultItemRender
+  },
+  VxeDatePicker: {
+    renderItemContent: defaultItemRender
+  },
+  VxeButton: {
+    renderItemContent: defaultFormItemRender
+  },
+  VxeButtonGroup: {
+    renderItemContent (h: CreateElement, renderOpts, params) {
+      const { options } = renderOpts
+      const { data, field } = params
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: {
+            options,
+            ...getComponentFormItemProps(renderOpts, params, itemValue)
+          },
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  VxeSelect: {
+    renderItemContent (h: CreateElement, renderOpts, params) {
+      const { data, field } = params
+      const { options, optionProps, optionGroups, optionGroupProps } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps, optionGroups, optionGroupProps }),
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  VxeTreeSelect: {
+    renderItemContent (h: CreateElement, renderOpts: any, params: any) {
+      const { data, field } = params
+      const { options, optionProps } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps }),
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  VxeIconPicker: {
+    renderItemContent: defaultFormItemRender
+  },
+  VxeRadio: {
+    renderItemContent: defaultFormItemRender
+  },
+  VxeRadioGroup: {
+    renderItemContent: formItemRadioAndCheckboxRender
+  },
+  VxeCheckbox: {
+    renderItemContent: defaultFormItemRender
+  },
+  VxeCheckboxGroup: {
+    renderItemContent: formItemRadioAndCheckboxRender
+  },
+  VxeSwitch: {
+    renderItemContent: defaultItemRender
+  },
+  VxeImage: {
+    renderItemContent (h: CreateElement, renderOpts, params) {
+      const { data, field } = params
+      const { props } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: {
+            ...props,
+            src: itemValue
+          },
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  VxeImageGroup: {
+    renderItemContent (h: CreateElement, renderOpts, params) {
+      const { data, field } = params
+      const { props } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getDefaultComponent(renderOpts), {
+          props: {
+            ...props,
+            urlList: itemValue
+          },
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  VxeUpload: {
+    renderItemContent: defaultItemRender
+  },
+
+  // 以下已废弃
+  $input: {
+    renderItemContent: oldItemRender
+  },
+  $textarea: {
+    renderItemContent: oldItemRender
+  },
+  $button: {
+    renderItemContent: oldButtonItemRender
+  },
+  $buttons: {
+    renderItemContent: oldButtonsItemRender
+  },
+  $select: {
+    renderItemContent (h: CreateElement, renderOpts, params) {
+      const { data, field } = params
+      const { options, optionProps, optionGroups, optionGroupProps } = renderOpts
+      const itemValue = XEUtils.get(data, field)
+      return [
+        h(getOldComponent(renderOpts), {
+          props: getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps, optionGroups, optionGroupProps }),
+          on: getItemOns(renderOpts, params)
+        })
+      ]
+    }
+  },
+  $radio: {
+    renderItemContent: oldFormItemRadioAndCheckboxRender
+  },
+  $checkbox: {
+    renderItemContent: oldFormItemRadioAndCheckboxRender
+  },
+  $switch: {
+    renderItemContent: oldItemRender
+  }
+  // 以上已废弃
+})

package/packages/form/src/form-config-item.ts

@@ -0,0 +1,219 @@
+import { PropType, CreateElement, VNode } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
+import XEUtils from 'xe-utils'
+import { getIcon, getI18n, renderer, renderEmptyElement, globalMixins } from '../../ui'
+import { getFuncText, isEnableConf } from '../../ui/src/utils'
+import { getSlotVNs } from '../../ui/src/vn'
+import { renderTitle } from './render'
+import { isActiveItem } from './util'
+
+import type { VxeFormConstructor, VxeFormDefines, VxeFormPrivateMethods, VxeComponentSlotType, VxeComponentSizeType } from '../../../types'
+
+const VxeFormConfigItem = defineVxeComponent({
+  name: 'VxeFormConfigItem',
+  mixins: [
+    globalMixins.sizeMixin
+  ],
+  props: {
+    itemConfig: Object as PropType<VxeFormDefines.ItemInfo>
+  },
+  inject: {
+    $xeForm: {
+      default: null
+    }
+  },
+  provide () {
+    const xeFormItemInfo = this
+    return {
+      xeFormItemInfo,
+      $xeFormGather: null
+    }
+  },
+  computed: {
+    ...({} as {
+      computeSize(): VxeComponentSizeType
+      $xeForm(): VxeFormConstructor & VxeFormPrivateMethods
+    })
+  },
+  methods: {
+    renderVN (h: CreateElement): VNode {
+      const $xeFormConfigItem = this
+      const props = $xeFormConfigItem
+      const $xeForm = $xeFormConfigItem.$xeForm
+
+      const formProps = $xeForm
+      const formReactData = $xeForm.reactData
+      const { data, rules, readonly, disabled, span: allSpan, align: allAlign, titleBold: allTitleBold, titleAlign: allTitleAlign, titleWidth: allTitleWidth, titleColon: allTitleColon, titleAsterisk: allTitleAsterisk, titleOverflow: allTitleOverflow, vertical: allVertical, padding: allPadding } = formProps
+      const item = props.itemConfig as VxeFormDefines.ItemInfo
+      const { collapseAll } = formReactData
+      const validOpts = $xeForm.computeValidOpts
+      const { slots, title, visible, folding, field, collapseNode, itemRender, showError, errRule, className, titleOverflow, vertical, padding, children, showTitle, contentClassName, contentStyle, titleClassName, titleStyle } = item
+      const compConf = isEnableConf(itemRender) ? renderer.get(itemRender.name) : null
+      const itemClassName = compConf ? (compConf.formItemClassName || compConf.itemClassName) : ''
+      const itemStyle = compConf ? (compConf.formItemStyle || compConf.itemStyle) : null
+      const itemContentClassName = compConf ? (compConf.formItemContentClassName || compConf.itemContentClassName) : ''
+      const itemContentStyle = compConf ? (compConf.formItemContentStyle || compConf.itemContentStyle) : null
+      const itemTitleClassName = compConf ? (compConf.formItemTitleClassName || compConf.itemTitleClassName) : ''
+      const itemTitleStyle = compConf ? (compConf.formItemTitleStyle || compConf.itemTitleStyle) : null
+      const defaultSlot = slots ? slots.default : null
+      const titleSlot = slots ? slots.title : null
+      const span = item.span || allSpan
+      const align = item.align || allAlign
+      const itemPadding = XEUtils.eqNull(padding) ? allPadding : padding
+      const itemVertical = XEUtils.eqNull(vertical) ? allVertical : vertical
+      const titleBold = XEUtils.eqNull(item.titleBold) ? allTitleBold : item.titleBold
+      const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign
+      const titleWidth = itemVertical ? null : (XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth)
+      const titleColon = XEUtils.eqNull(item.titleColon) ? allTitleColon : item.titleColon
+      const titleAsterisk = XEUtils.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk
+      const itemOverflow = XEUtils.eqNull(titleOverflow) ? allTitleOverflow : titleOverflow
+      const ovEllipsis = itemOverflow === 'ellipsis'
+      const ovTitle = itemOverflow === 'title'
+      const ovTooltip = itemOverflow === true || itemOverflow === 'tooltip'
+      const hasEllipsis = ovTitle || ovTooltip || ovEllipsis
+      const params = { data, disabled, readonly, field, property: field, item, $form: $xeForm, $grid: $xeForm.xegrid }
+      if (visible === false) {
+        return renderEmptyElement($xeFormConfigItem)
+      }
+      let isRequired = false
+      let isValid = false
+      if (!readonly && rules) {
+        const itemRules = rules[field]
+        if (itemRules && itemRules.length) {
+          isValid = true
+          isRequired = itemRules.some((rule) => rule.required)
+        }
+      }
+      // 如果为项集合
+      const isGather = children && children.length > 0
+      if (isGather) {
+        const childVNs = children.map((childItem, index) => {
+          return h(VxeFormConfigItem, {
+            key: index,
+            props: {
+              itemConfig: childItem
+            }
+          })
+        })
+        return childVNs.length
+          ? h('div', {
+            class: ['vxe-form--gather vxe-form--item-row', item.id, span ? `vxe-form--item-col_${span} is--span` : '', className ? (XEUtils.isFunction(className) ? className(params) : className) : '']
+          }, childVNs)
+          : renderEmptyElement($xeFormConfigItem)
+      }
+      let contentVNs: VxeComponentSlotType[] = []
+      const rftContent = compConf ? (compConf.renderFormItemContent || compConf.renderItemContent) : null
+      if (defaultSlot) {
+        contentVNs = $xeForm.callSlot(defaultSlot, params)
+      } else if (rftContent) {
+        contentVNs = getSlotVNs(rftContent(h, itemRender, params))
+      } else if (field) {
+        contentVNs = [XEUtils.toValueString(XEUtils.get(data, field))]
+      }
+      if (collapseNode) {
+        contentVNs.push(
+          h('div', {
+            class: 'vxe-form--item-trigger-node',
+            on: {
+              click: $xeForm.toggleCollapseEvent
+            }
+          }, [
+            h('span', {
+              class: 'vxe-form--item-trigger-text'
+            }, collapseAll ? getI18n('vxe.form.unfolding') : getI18n('vxe.form.folding')),
+            h('i', {
+              class: ['vxe-form--item-trigger-icon', collapseAll ? getIcon().FORM_FOLDING : getIcon().FORM_UNFOLDING]
+            })
+          ])
+        )
+      }
+      if (errRule && validOpts.showMessage) {
+        contentVNs.push(
+          h('div', {
+            class: 'vxe-form--item-valid',
+            style: errRule.maxWidth
+              ? {
+                  width: `${errRule.maxWidth}px`
+                }
+              : {}
+          }, errRule.content)
+        )
+      }
+      const ons: any = ovTooltip
+        ? {
+            mouseenter (evnt: MouseEvent) {
+              $xeForm.triggerTitleTipEvent(evnt, params)
+            },
+            mouseleave: $xeForm.handleTitleTipLeaveEvent
+          }
+        : {}
+      return h('div', {
+        class: [
+          'vxe-form--item',
+          item.id,
+          span ? `vxe-form--item-col_${span} is--span` : '',
+          className ? (XEUtils.isFunction(className) ? className(params) : className) : '',
+          itemClassName ? (XEUtils.isFunction(itemClassName) ? itemClassName(params) : itemClassName) : '',
+          {
+            'is--title': title,
+            'is--colon': titleColon,
+            'is--bold': titleBold,
+            'is--padding': itemPadding,
+            'is--vertical': itemVertical,
+            'is--asterisk': titleAsterisk,
+            'is--valid': isValid,
+            'is--required': isRequired,
+            'is--hidden': folding && collapseAll,
+            'is--active': isActiveItem($xeForm, item),
+            'is--error': showError
+          }
+        ],
+        style: XEUtils.isFunction(itemStyle) ? itemStyle(params) : (itemStyle || {})
+      }, [
+        h('div', {
+          class: 'vxe-form--item-inner'
+        }, [
+          (showTitle !== false) && (title || titleSlot)
+            ? h('div', {
+              class: [
+                'vxe-form--item-title',
+                titleAlign ? `align--${titleAlign}` : '',
+                hasEllipsis ? 'is--ellipsis' : '',
+                itemTitleClassName ? (XEUtils.isFunction(itemTitleClassName) ? itemTitleClassName(params) : itemTitleClassName) : '',
+                titleClassName ? (XEUtils.isFunction(titleClassName) ? titleClassName(params) : titleClassName) : ''
+              ],
+              style: Object.assign(
+                {},
+                XEUtils.isFunction(itemTitleStyle) ? itemTitleStyle(params) : itemTitleStyle,
+                XEUtils.isFunction(titleStyle) ? titleStyle(params) : titleStyle,
+                titleWidth
+                  ? {
+                      width: isNaN(titleWidth as number) ? titleWidth : `${titleWidth}px`
+                    }
+                  : null
+              ),
+              attrs: {
+                title: ovTitle ? getFuncText(title) : null
+              },
+              on: ons
+            }, renderTitle(h, $xeFormConfigItem as any, $xeForm, item))
+            : null,
+          h('div', {
+            class: [
+              'vxe-form--item-content',
+              align ? `align--${align}` : '',
+              itemContentClassName ? (XEUtils.isFunction(itemContentClassName) ? itemContentClassName(params) : itemContentClassName) : '',
+              contentClassName ? (XEUtils.isFunction(contentClassName) ? contentClassName(params) : contentClassName) : ''
+            ],
+            style: Object.assign({}, XEUtils.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, XEUtils.isFunction(contentStyle) ? contentStyle(params) : contentStyle)
+          }, contentVNs)
+        ])
+      ])
+    }
+  },
+  render (this: any, h) {
+    return this.renderVN(h)
+  }
+})
+
+export default VxeFormConfigItem