简介

JSON组件用于在表格列中展示JSON格式的数据，支持格式化显示和语法高亮。

用法示例

基础用法

use plugin\xbCode\builder\Builder;

// 创建表格
Builder::crud(function($builder) {
  // 添加JSON列
  $builder->addColumnJson('config', '配置信息');
});

自定义配置

Builder::crud(function($builder) {
  // 使用回调函数自定义配置
  $builder->addColumnJson('meta_data', '元数据', function($component) {
    $component->width(300);
    $component->className('json-display');
  });
  
  // 使用数组方式配置
  $builder->addColumnJson('settings', '设置', [
    'width' => 250,
    'levelExpand' => 2 // 展开层级
  ]);
});

组件参数

参数名	类型	默认值	说明
name	string	必填	字段名称，对应数据库字段
label	string	必填	列标题，显示在表格头部
option	callable\|array	[]	配置选项，可以是回调函数或数组

JSON组件属性

属性名	类型	默认值	说明
className	string	-	外层 CSS 类名
width	int\|string	-	列宽度
levelExpand	int	-	默认展开的层级
placeholder	string	-	占位符

使用场景

配置信息展示
API响应数据展示
元数据显示
结构化数据查看

注意事项

数据库字段应存储有效的JSON字符串
组件会自动进行格式化显示
支持语法高亮功能
建议设置合适的列宽度以完整显示JSON内容
可以通过 levelExpand 控制默认展开的层级