README

为Laravel Nova创建的无线电按钮字段。

安装

composer require norman-huth/nova-radio-field

使用方法

use NormanHuth\NovaRadioField\Radio;

//..
Radio::make(__('Radio'), 'select')
    ->options([
        'S' => __('Small'),
        'M' => __('Medium'),
        'L' => __('Large'),
    ])

高级使用

字段帮助文本

如果您想在字段下方放置“帮助”文本，可以在定义字段时调用help方法。

Radio::make(__('Radio'), 'select')
    ->help(__('Help Text'))

无线电标签的帮助文本

如果您想在无线电标签下方放置“帮助”文本，可以在定义字段时调用radioHelpTexts方法。

Radio::make(__('Radio'), 'select')
    ->radioHelpTexts([
        'S' => __('Select small size'),
        'L' => __('Select large size'),
    ])

默认值

默认情况下，此字段使用数组中的第一个项目作为默认值。您可以通过调用default方法来设置另一个默认值，该方法接受一个值或回调。

Radio::make(__('Radio'), 'select')
    ->default('M')
    
Radio::make(__('Radio'), 'select')
    ->default(function (NovaRequest $request) {
        return $request->user()->group_id;
    }))

行内无线电框

如果您想将无线电按钮放在列内而不是行内，请使用inline方法。

Radio::make(__('Radio'), 'select')
    ->inline()

样式

控制间隙

如果您想更改无线电按钮之间的间隙，请使用gap方法。

默认: 1 (0.25rem)

Radio::make(__('Radio'), 'select')
    ->gap(3)

向字段添加类

您可以在定义字段时调用addClasses方法，向字段的class属性添加类。

Radio::make(__('Radio'), 'select')
    ->addClasses(['text-center']),

设置字段类

您可以在定义字段时调用setClasses方法，从默认字段类中删除并设置新的字段类。

Radio::make(__('Radio'), 'select')
    ->setClasses(['flex', 'flex-wrap', 'justify-between']),

向字段添加样式

您可以在定义字段时调用addStyles方法，向字段的style属性添加样式。

Radio::make(__('Radio'), 'select')
    ->addStyles(['max-width' => '25rem']),

向字段标签添加类

您可以在定义字段时调用addClasses方法，向字段标签的class属性添加类。

Radio::make(__('Radio'), 'select')
    ->addLabelClasses(['truncate']),

向字段标签添加样式

您可以在定义字段时调用addStyles方法，向字段标签的style属性添加样式。

Radio::make(__('Radio'), 'select')
    ->addLabelStyles(['max-width' => '10rem']),

示例：创建类似于第3个预览的网格

Radio::make(__('Radio'), 'select')
    ->options([
        'S' => __('Small'),
        'M' => __('Medium'),
        'L' => __('Large'),
        'E' => __('Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam'),
        'G' => __('Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam'),
    ])
    ->radioHelpTexts([
        'S' => __('Select small size'),
        'L' => __('Select large size'),
    ])
    ->gap(4)
    ->inline()
    ->addLabelStyles(['width' => '15rem']),

不显示标签，类似于第4个预览

Radio::make(__('Radio'), 'select')
    ->withoutLabel()
    ->addClasses(['py-4'])

添加标题，类似于第4个预览

Radio::make(__('Radio'), 'select')
    ->title('Select A Size')

向标题添加类

Radio::make(__('Radio'), 'select')
    ->addTitleClasses(['pt-2'])

或删除默认类并设置自己的类

Radio::make(__('Radio'), 'select')
    ->setTitleClasses([])

向标题添加样式

Radio::make(__('Radio'), 'select')
    ->addTitleStyles(['padding-left: 1rem'])

在索引页和详情页上显示键值

如果您想显示值而不是标签，可以在定义字段时调用displayUsingValues方法。

Radio::make(__('Radio'), 'select')
    ->displayUsingValues()

norman-huth / nova-radio-field

维护者

详情