这次给大家带来ElTableColumn如何自定义内容,ElTableColumn自定义内容的注意事项有哪些,下面就是实战案例,一起来看一下。
公司有一个新的需求,点击ElTableColumn的头部可以进行搜索,这个功能同事已经做出来了,但是使用有些不方便,自己就打算封装成一个组件,学习一下。
ElTableColumn本来是这个样子的:
要做成的是这个样子:
我直接就放代码了,挨着挨着说明太多了。
代码的结构:
组件
import ElTableColumnPro from './ElTableColumnPro' ElTableColumnPro.install = function(Vue) { Vue.component(ElTableColumnPro.name, ElTableColumnPro); }; export default ElTableColumnPro; {{fomatMethod(scope.row[prop])}}
安装
import ElTableColumnPro from 'components/ElTableColumnPro/index' ... ... ... Vue.use(ElTableColumnPro)
使用
{{scope.row.content}} 로그인 후 복사
注释就不挨着打了....
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
위 내용은 ElTableColumn如何自定义内容의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!