feat: SelectV2改造完成

This commit is contained in:
kailong321200875
2023-05-11 15:52:04 +08:00
parent cdc7c76eb5
commit 4d04734e13
7 changed files with 183 additions and 75 deletions

View File

@@ -459,11 +459,11 @@ const schema = reactive<FormSchema[]>([
select: handleSelect
},
slots: {
default: (item: any) => {
default: (_, { item }) => {
return (
<>
<div class="value">{item.value}</div>
<span class="link">{item.link}</span>
<div class="value">{item?.value}</div>
<span class="link">{item?.link}</span>
</>
)
}
@@ -689,56 +689,75 @@ const schema = reactive<FormSchema[]>([
}
}
}
},
{
field: 'field18',
label: `${t('formDemo.selectV2')}`,
component: 'Divider'
},
{
field: 'field19',
label: t('formDemo.default'),
component: 'SelectV2',
componentProps: {
value: undefined,
options: options.value
}
},
{
field: 'field20',
label: t('formDemo.slot'),
component: 'SelectV2',
componentProps: {
options: options.value,
slots: {
default: (option: SelectOption) => {
return (
<>
<span style="margin-right: 8px">{option?.label}</span>
<span style="color: var(--el-text-color-secondary); font-size: 13px">
{option?.value}
</span>
</>
)
}
}
}
},
{
field: 'field21',
label: t('formDemo.selectGroup'),
component: 'SelectV2',
componentProps: {
options: options2.value
}
},
{
field: 'field22',
label: `${t('formDemo.selectGroup')}${t('formDemo.slot')}`,
component: 'SelectV2',
componentProps: {
options: options2.value,
slots: {
default: (option: SelectOption) => {
return (
<>
<span style="margin-right: 8px">{option?.label}</span>
<span style="color: var(--el-text-color-secondary); font-size: 13px">
{option?.value}
</span>
</>
)
}
}
}
},
{
field: 'field23',
label: t('formDemo.cascader'),
component: 'Divider'
}
// {
// field: 'field18',
// label: `${t('formDemo.selectV2')}`,
// component: 'Divider'
// },
// {
// field: 'field19',
// label: t('formDemo.default'),
// component: 'SelectV2',
// componentProps: {
// options: options.value
// }
// },
// {
// field: 'field20',
// label: t('formDemo.slot'),
// component: 'SelectV2',
// componentProps: {
// options: options.value,
// slots: {
// default: true
// }
// }
// },
// {
// field: 'field21',
// label: t('formDemo.selectGroup'),
// component: 'SelectV2',
// componentProps: {
// options: options2.value
// }
// },
// {
// field: 'field22',
// label: `${t('formDemo.selectGroup')}${t('formDemo.slot')}`,
// component: 'SelectV2',
// componentProps: {
// options: options2.value,
// slots: {
// default: true
// }
// }
// },
// {
// field: 'field23',
// label: t('formDemo.cascader'),
// component: 'Divider'
// },
// {
// field: 'field24',
// label: t('formDemo.default'),
// component: 'Cascader',