columnStyle

Description

Optional. Defines the style of a column in the table

Usage

columnStyle?: (column: IColumn) => string;

Parameters

The function takes the following parameters:

• column - an object with the column configuration parameters. All parameters description you can find here: columns

The function returns the name of a CSS class or an empty string.

Example

<script setup>
    import { getData } from "./common/data";
    import { Grid } from "@svar-ui/vue-grid";

    const { data, columns } = getData();

</script>

<template>
<div style="padding: 20px;">
   <div>
    <Grid
      :data="data"
      :columns="columns"
      :columnStyle="col => (col.id == 'city' ? 'columnStyle' : '')"
    />
</div>

</div>
</template>

<style scoped>
    :global(.columnStyle) {
        text-decoration: underline;
        color: rgb(231, 7, 231);
    }
</style>

---

Related articles: columns