avue-curd表格常用属性和用法

最新推荐文章于 2024-08-23 11:07:06 发布

金憨憨_

最新推荐文章于 2024-08-23 11:07:06 发布

阅读量1w

点赞数 5

分类专栏： # avue 文章标签： vue js

本文链接：https://blog.csdn.net/qq_40573810/article/details/119024192

版权

本文介绍了在Vue项目中如何利用avue库创建CURD表格，并强调了在option.js文件中定义默认参数的方法，以便在组件中进行个性化配置。同时，提示读者可查阅avue的官方文档获取更全面的参数信息。

摘要由CSDN通过智能技术生成

个人用法：在vue中可以单独建立一个option.js文件，放置默认的统一参数，在使用的vue组件中引入该文件，设置组件内特殊的参数。

全面参数请参考 avue官方文档

option.js文件

// 默认表格选项
export function cardOption (config) {
   
  const option = {
   
    loading: false, 
    searchBtnLoading: false,
    tip: false,
    title: '列表',
    height: "auto",
 	calcHeight: 95,	// 与height:'auto' 配合使用
    size: 'mini',
    page: true,
    selection: false, 		//表格勾选列
	searchBtn:true/false	//搜索按钮
    viewBtn: false/true,	//查看按钮
    addBtn: true/false,		//添加按钮
    saveBtn: true/false,	//保存按钮
    cancelBtn: true/false,	//取消按钮
    emptyBtn: true/false,	//清空按钮
    viewBtn: false/true,	//查看按钮
    cellBtn: true/false,	//表格行编辑操作按钮
    delBtn: true/false,		//行内删除按钮
    editBtn: true/false,	//行内编辑按钮
    excelBtn: false/true,	//导出Excel按钮
    filterBtn: false/true,	//自定义过滤表格列按钮
    align: 'left',
    menuAlign: 'left',
    index: true, //是否显示表格序号
    indexWidth: 80,