Vue自定义表格组件（测试版）
Vue自定义表格组件
考虑到最近在使用element框架开发管理后台，用到表格组件的次数比较多，简单做了一个数据展示型的表格组件，至于交互按钮上面还没有通过验证。
表格列提供4种数据处理展示，文本（默认）、图片、匹配文本、匹配文本按钮,做一下解释。
| 字段 | 类型 | 必填 | 备注 |
|---|---|---|---|
| prop | String | 是 | 后台返回的列字段（所有数据处理必填） |
| showImage | Boolean | 否 | style字段自定义样式 |
| options | Object[Object] | 否 | 匹配文本，格式如{1:{title:'文案1',type:'primary'}} |
| onAction | Function | 否 | 用于匹配按钮事件传参 |
| permission | Boolean | 否 | 用于提供匹配按钮权限 |
组件代码
{{ (page - 1) * limit + scope.$index + 1 }}
{{ item.options[scope.row[item.prop]]['title'] || scope.row[item.prop] }}
文章图片
{{ item.options[scope.row[item.prop]].title }}
{{ scope.row[item.prop] || '' }}
{{ item.title }}
【Vue自定义表格组件（测试版）】2.页面引用方式
查询
重置
推荐阅读
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 【官方推荐】Laravel7|【官方推荐】Laravel7 + Vue2.0前后端分离框架通用后台源码
- Vue|Vue 源码解读（12）—— patch
- 自定义|自定义 serializers.ValidationError 的错误返回
- VuePress|VuePress 博客之 SEO 优化（二）之重定向
- vue-slot理解
- 处理 element-UI 中table表格多选框判断是否禁用问题
- petite-vue源码剖析-属性绑定`v-bind`的工作原理
- Vue|Vue 组件化基本使用详情
- Vue生命周期中的组件化你知道吗
- vue3+ts+vite|vue3+ts+vite 问题汇总-环境变量（三）