---
url: "https://vueda.dev/v3/reference/api/vue/ColumnJson.md"
title: "ColumnJson"
---

# ColumnJson

## Overview

`JSON` list column adapter. Wraps {@link JsonDisplay} in its inline form, binding the
cell's raw `value` and forwarding the options resolved from `columnMappings` (per field
type) and any `columnProps` override.

A cell has one line to work with, so this renders compact `JSON` and truncates past
`maxLength`, while the read view indents the same value through
{@link WidgetJsonReadOnly}. That is a layout difference, not a wording one: both print
the same `JSON` and give a null value the same dash.

This replaces the {@link ColumnText} fallback that previously handled these cells. The
visible changes are the mono stack, the dash for a null, and `value` rather than
`formatted` as the source, so a cell reflects the stored payload rather than the grid's
pre-formatted copy of it.

Receives the ObjectsGrid `value` slot props; only `value` is consumed for rendering.
`inheritAttrs` is disabled so the remaining cell context props (`field`, `formatted`,
`obj`, etc.) are not leaked as DOM attributes onto the JsonDisplay root.

## Props

| Name | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| <span id="prop-value">value</span> | `string\|number\|boolean\|object\|array` |  | `undefined` | Raw cell value. |
| <span id="prop-maxLength">maxLength</span> | `number` |  | `200` | Character cap past which the text is truncated. `0` removes the cap. |

## Source

`client/lib/objects-grid/ColumnJson.vue`