如何操作数据表中的数据

Posted 2023-02-22

【中文标题】如何操作数据表中的数据

【英文标题】：how to manipulate data in Datatables

【发布时间】：2021-03-10 20:07:57

【问题描述】：

我正在使用带有 Vue.js 的 Datatables 以表格的形式呈现内容。这是我的代码：

computed: 
    job_table: function () 
      return 
        title: this.$t('commons.users'),
        headers:[
          
            text: "Post",
            value : "title",
            align: "left",
            filter: 'capitalize',
            search : 'title'
          ,
          
            text: "New Application",
            value : "applications",
            align: "left",
            filter: 'capitalize',
            search : 'applications'
          ,
          
            text: "Status",
            value : "status",
            align: "left", 
            filter: 'capitalize',
            search : 'status'
          ,
          
            text: "Posted On",
            value : "created_at",
            align: "left",
            filter: 'capitalize',
            search : ''
          ,
          
            text: "Actions",
            align: "left",
            value : "role",
            filter: 'roleFilter',
            search : false
          
        ],
        desc: 'created_at',
        resource: 'job',
        w:'company',
        actions: 
          add: "AddEmployee",
          edit: "EditEmployee"
        ,
        params:
          company_id: true
        
      
    ,
  

我想更改“创建于”的格式并计算“应用程序”的数量，这是一个数组。我可以对他们进行回调吗？

 
            text: "New Application",
            value : "applications",
            align: "left",
            filter: 'capitalize',
            search : 'applications'
          , 

            text: "Posted On",
            value : "created_at",
            align: "left",
            filter: 'capitalize',
            search : ''
          ,

我是 javascript 新手，任何帮助都会非常感激。提前致谢。

【参考方案1】：

我不知道你想使用哪个数据表（Bootstrap、Vuetify 等），但对于应用程序，你可以试试这个：

            text: "New Application",
            value : "applications.length",
            align: "left",
            filter: 'capitalize',
            search : 'applications'
          ,

所以该值将是应用程序数组的长度。

格式化created_at 你应该注意有没有办法为数据表使用槽，通常库使用槽和模板来注入自定义格式。例如对于 Vuetify：https://dev.vuetifyjs.com/en/components/data-tables/#slots

【讨论】：

我想要基于申请状态的长度，那么有没有办法计算状态为新、已通过等的申请的长度