首页 > 其他分享 >vxe-table 实现指定列默认是隐藏,点击重置自动还原状态

vxe-table 实现指定列默认是隐藏,点击重置自动还原状态

时间:2024-12-07 12:54:12浏览次数:8  
标签:name 自定义 title vxe 重置 默认 sex field table

vxe-table 实现控制指定列默认隐藏,重置自定义列后还能自动还原,有个需求需要将某一列默认是隐藏的,但是可以通过自定义列设置显示,当点击自定义的重置按钮时,还能回复到默认的状态,实现也是非常简单的。通过 visible 参数设置默认为不显示就可以了。

官网:https://vxetable.cn/

通过 visible 参数设置默认为不显示,但是用户可以操作自定义列设置,可以自定义勾选显示
还是实现服务端保存自定义列数据以及服务端还原,从而实现用户个性化数据信息保存。

<template>
  <div>
    <vxe-grid v-bind="gridOptions"></vxe-grid>
  </div>
</template>

<script>
export default {
  data () {
    const gridOptions = {
      border: true,
      toolbarConfig: {
        custom: true
      },
      columns: [
        { field: 'seq', type: 'seq', width: 70 },
        { field: 'role', title: 'Role', visible: false },
        { field: 'name', title: 'Name' },
        { field: 'sex', title: 'Sex' },
        { field: 'age', title: 'Age' },
        { field: 'address', title: 'Address', visible: false }
      ],
      data: [
        { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc' },
        { id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou' },
        { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai' },
        { id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 24, address: 'Shanghai' }
      ]
    }
    return {
      gridOptions
    }
  }
}
</script>

查看 gitee: https://gitee.com/x-extends/vxe-table

标签:name,自定义,title,vxe,重置,默认,sex,field,table
From: https://www.cnblogs.com/qaz666/p/18592010

相关文章

  • Stable Diffusion核心网络结构——VAE
    本文详细介绍SD模型的三部件之一——VAE,阐述VAE在SD模型中的作用和完整的架构。目录传统VAEStableDiffusion核心网络结构SD模型整体架构初识VAE模型【1】StableDiffusion中VAE的核心作用【2】StableDiffusion中VAE的高阶作用【3】StableDiffusion中VAE模型的完......
  • HTML布局-div,span,table
    HTML布局HTML布局-使用<div>元素div元素是用于分组HTML元素的块级元素HTML布局-使用表格table标签是创建布局的一种简单的方式大多数站点可以使用div,table元素来创建多列。css用于对元素进行定位,或者为页面创建背景以及色彩丰富的外观HTML布局-提示使用css好处是,如果把c......
  • C++——哈希表(Hash Table),附加于 Python 中字典区别于联系
    哈希表(HashTable)是一种非常高效的数据结构,用于存储键值对(key-value)。允许我们以非常快的速度进行插入、删除和查找操作,因为这些操作的时间复杂度平均为O(1)。哈希表通过使用哈希函数将键映射到表中的位置,从而实现快速访问。一、【哈希表的基本概念】1、哈希函数:这是一个将......
  • Stable Diffusion新手指南:提示词的奥秘
    StableDiffusion,这款AI绘画界的新星,让创意不再受限。但对新手来说,如何用好提示词(prompts)是迈向艺术创作的第一步。今天,我们就来揭开提示词的神秘面纱,让你的AI绘画之旅更加顺畅。**提示词:**就是你告诉StableDiffusion你想画什么。它可以是一句话,也可以是多个词的组合。用......
  • Mysql8.0修改配置参数lower_case_table_names
    现象今天在配置一个环境的数据库,所使用的系统要求该数据库lower_case_table_names=1(对数据库表明、列名大小写不敏感)我看了一下,在Windows上,默认值为1。在macOS上,默认值是2。在Linux上,不支持值2;服务器会将该值设置为0。那0是不符合我们需求的,于是我打开my.cnf进......
  • 【AI绘画stable diffusion教程】对普通人来说,Stable diffusion 和 Midjourney 怎么选?
    前言这个问题我觉得挺好,因为虽然StableDiffusion(SD)和Midjourney(MJ)这2个AI绘画工具的名字已经深入广大AI爱好者的内心了,但对于普通人(包括刚接触到AI绘画的童鞋)来说,看到这2个名字仍然还是会感觉到陌生。那么,今天我就来给新手用户来讲讲这2个AI绘画工具的区别,我们应该如何选......
  • 【Stable Diffusion系统教学】Ai绘画零基础入门到精通商业实战 人工智能绘图画图商业
    前言经过长时间的精心准备,我终于完成了这份StableDiffusion(以下简称SD)的使用教程!这份教程将带你从安装部署开始,逐步深入了解界面功能、实战案例制作。每一步都配有详细的指导,让你不仅能够理解,而且能够立刻动手实践。同时,无论是安装包,大模型,lora,关键词的文件都给大家打包......
  • vxe-table 实现展开行的用法
    使用vxe-table实现展开行的,通过设置type=expand,给列加上content插槽,就可以开启展开行了官网:https://vxetable.cn/<template><div><vxe-gridv-bind="gridOptions"><template#expand_content="{row}"><div>Name:{......
  • Guava Table:多维度的数据 Table15
    多维度的数据Table通常情况下,我们可以将一个二维的Table看作是行列交集的数据表。而如果我们需要在Table中进一步进行分组和索引,想要为每一个维度增加一个标识(比如多重索引),那么我们就需要更复杂的多维度数据。GuavaTable并不直接支持多维度结构(如三维或更高维度的......
  • Guava Table:多维度的数据 Table11
    多维度的数据Table通常情况下,我们可以将一个二维的Table看作是行列交集的数据表。而如果我们需要在Table中进一步进行分组和索引,想要为每一个维度增加一个标识(比如多重索引),那么我们就需要更复杂的多维度数据。GuavaTable并不直接支持多维度结构(如三维或更高维度的......