首页 > 解决方案 > 如何操作数据表中的数据

问题描述

我正在使用带有 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 新手,任何帮助都会非常重要。提前致谢。

标签: javascriptjqueryvue.jsdatatables

解决方案


我不知道你想使用哪个数据表(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


推荐阅读