这次给大家带来怎样使用VUE对element-ui内ElTableColumn扩展,使用VUE对element-ui内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中文网其它相关文章!
推荐阅读:










