slot cannot work in jsx ,how to fix it?
Version
3.0.5
Steps to reproduce
my jsx code:
<el-popover placement='right' width='300' trigger='hover'>
{popoverContent}
<el-tag key={item.teacherName} size='mini' slot='reference'>
{item.teacherName}
</el-tag>
</el-popover>
it work well in vue2, but cannot in vue3. change to h function, it work.
h(
ElPopover,
{ placement: 'right', width: '300', trigger: 'hover' },
{
default: () => popoverContent,
reference: () => {
return (
<el-tag key={item.teacherName} size="mini">
{item.teacherName}
</el-tag>
)
},
},
)
What is expected?
I want to write slot in jsx not h funtion, how can i do it?
jsx is close template.
What is actually happening?
vue3 dont support slot prop in jsx.