Element-ui API
说:content
可以通过slot
传入DOM
。
![](https://img.haomeiwen.com/i1976589/8c09362d92552b85.png)
那这个
slot
是如何实现的呢?看源码:![](https://img.haomeiwen.com/i1976589/de7a36658c791404.png)
就是一个
slot
元素。
通过插槽分发内容的解释:
slot
元素作为组件模板之中的内容分发插槽,自身会被组件里的内容替换。
所以,可以直接在el-popover
组件里写html
内容:
<el-popover placement="top-start" width="200" trigger="hover">
<img :src="url" />
<img slot="reference" :src="url" />
</el-popover>
如果是写在表格formatter
里面的,应换成 jsx
语法:
formatter: (row, column, cellValue, index) => {
return (
<el-popover
placement="top-start"
width="200"
trigger="hover"
>
<img src={cellValue} />
<img slot="reference" src={cellValue} />
</el-popover>
);
}
网友评论