Question

我是VueJS世界中的新手，我正在尝试创建一个简单的CRUD应用程序。我们已经决定使用vue-tables-2库，它可以在以下代码中正常工作：

<template>
  <div id="users">
    <v-server-table url="users" :columns="columns">
    </v-server-table>
  </div>
</template>
<script>
  export default {
    name: 'UsersContainer',
    components: {},
    data() {
      return {
        columns: ["fullName", "age", "city"]
      }
    },
  }
</script>

它显示数据，但是标题只是骆驼情况下的属性。

我需要添加自定义标题，例如FullName应该为Name 可以更改标题吗？

Answer 1

这很容易实现。根据{{3}}，您可以向表组件提供options。

根据您的情况，您可以通过以下方式修改代码段：

<template>
  <div id="users">
    <v-server-table url="users" :options="options" :columns="columns">
    </v-server-table>
  </div>
</template>
<script>
  export default {
    name: 'UsersContainer',
    components: {},
    data() {
      return {
        columns: ["fullName", "age", "city"],
        options: {
          headings: {
            fullName: 'Name',
            age: 'Age',
            city: 'City'
          }
        }
      }
    },
  }
</script>

从上面的片段中可以看到，我们正在返回一个对象，其中属性是您的商品属性，值是所需的标题。

Vue表2自定义标题名称

1 个答案: