refactor(form-item-gi): clean code

This commit is contained in:
07akioni 2021-09-16 02:17:32 +08:00
parent c11edb289b
commit c1e2946b59
2 changed files with 7 additions and 13 deletions

View File

@ -1,7 +1,7 @@
import { h, ref, defineComponent, getCurrentInstance } from 'vue'
import { h, ref, defineComponent } from 'vue'
import NGridItem, {
gridItemProps,
GridItemVNodeProps
gridItemPropKeys
} from '../../grid/src/GridItem'
import { keep, keysOf } from '../../_utils'
import type { ExtractPublicPropTypes } from '../../_utils'
@ -22,7 +22,7 @@ export default defineComponent({
name: 'FormItemGridItem',
alias: ['FormItemGi'],
props: formItemGiProps,
setup (props) {
setup () {
const formItemInstRef = ref<FormItemInst | null>(null)
const validate: FormItemInst['validate'] = ((...args: any[]) => {
const { value } = formItemInstRef
@ -42,10 +42,7 @@ export default defineComponent({
}
},
render () {
const self = getCurrentInstance()
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const gridItemProps = self!.vnode.props as GridItemVNodeProps
return h(NGridItem, gridItemProps, {
return h(NGridItem, keep(this.$.vnode.props || {}, gridItemPropKeys), {
default: () => {
const itemProps = keep(this.$props, formItemPropKeys)
return h(

View File

@ -1,7 +1,6 @@
import {
h,
defineComponent,
CSSProperties,
inject,
renderSlot,
getCurrentInstance,
@ -14,7 +13,7 @@ import type { ExtractPublicPropTypes } from '../../_utils'
export const defaultSpan = 1
export interface GridItemVNodeProps {
interface GridItemVNodeProps {
privateOffset?: number
privateSpan?: number
privateColStart?: number
@ -50,7 +49,7 @@ export default defineComponent({
name: 'GridItem',
alias: ['Gi'],
props: gridItemProps,
setup (props) {
setup () {
const {
xGapRef,
itemStyleRef,
@ -86,9 +85,7 @@ export default defineComponent({
},
render () {
return (
<div
style={[this.itemStyle, this.deriveStyle()] as unknown as CSSProperties}
>
<div style={[this.itemStyle as any, this.deriveStyle()]}>
{renderSlot(this.$slots, 'default', { overflow: this.overflow })}
</div>
)