corbinjurgens / qform
快速创建输入。适用于 Bootstrap 4,但你可以修改模板
Requires
- laravel/framework: >=7.0.0
This package is not auto-updated.
Last update: 2024-09-24 02:11:40 UTC
README
已确认在 Laravel 7.0.0、8.0.0 和 8.73.2 项目上工作正常
为个人使用而创建,请随意使用/扩展
QForm for Laravel 执行了大量的 HTML 表单操作,利用 Laravel 组件
- 使用单个组件创建大多数类型的 HTML 输入
- 自动获取 old() 值和错误
- 利用附加函数自动为输入表单名称属性添加前缀
- 可定制模板
- 在提供的基 Bootstrap 4 模板中,它尝试提供标签、错误和其他可访问性功能。
<x-qform-input type="text" name="name" title="This is the name input" /> <x-qform-input type="email" name="email" title="This is the email input" /> <x-qform-input type="select" name="level" title="This is the level input" :variables="[0 => 'User', '1' => 'Admin']" int />
- 输入将根据提供的名称自动查找错误和旧值
- 输入将根据 @QFormData() 给定的数组或模型或直接从 "data" 属性获取输入值
警告
对于选择和其他变量输入类型,使用严格比较。如果您的输入值是整数,并且在变量数组中声明为整数,您需要设置 "int" 属性,以便在比较之前将其转换为整数
设置
Composer
composer require corbinjurgens/qform
手动安装
将以下内容复制到主 composer.(如果包添加到 packages/corbinjurgens/qform)
"autoload": {
"psr-4": {
"Corbinjurgens\\QForm\\": "packages/corbinjurgens/qform/src"
},
},
并运行
composer dump-autoload
将以下内容添加到 config/app.php 提供者
Corbinjurgens\QForm\ServiceProvider::class,
在 config/app.php 中添加别名
"QForm" => Corbinjurgens\QForm\Facade::class,
基本用法
直接使用
直接使用组件,并纯粹从模板中受益,模板负责 HTML 和 CSS
简单输入
<x-qform-input type="text" name="name" value="This is text" title="This is the column name" /> // $value = 'This is text'; <x-qform-input type="textarea" name="name1" :value="$value" :title="__('column.text1')" /> // $value = True; In this case the checkbox value will always be 1, and only be checked if value is true <x-qform-input type="checkbox" name="name2" :value="$value" :title="__('column.text2')" />
数组输入,即具有多个选项的任何内容
如果您的变量键是整数,请确保设置 int 属性,以便可以正确比较值
// $value = 1; // $variables = [1 => 'Option 1', 2 => 'Option 2', 3 => 'Option 3']; <x-qform-input type="select" name="name" :value="$value" :title="__('column.text')" :variables="$variables" int /> // $value = 'option1'; // $variables = ['option1' => 'Option 1', 'option2' => 'Option 2', 'option3' => 'Option 3']; <x-qform-input type="radio" name="name" :value="$value" :title="__('column.text')" :variables="$variables" /> // $value = [1, 2, 3]; If a checkbox has an array given for :variables, it will behave differently and expect :value to also be array // $variables = [1 => 'Option 1', 2 => 'Option 2', 3 => 'Option 3']; <x-qform-input type="checkbox" name="name" :value="$value" :title="__('column.text')" :variables="$variables" int />
智能使用
使用 QForm 工具是此包的预期用法
在您的模板中设置目标模型或数组。之后的所有输入都将使用此数据来检索值
@QFormData(['test' => '1', 'test2' => 2]) {{-- The component parses the name property, and gets the 'test' column from the data --}} <x-qform-input type="text" name="prefix[test]" /> {{-- If the required data column differs from the name, you can specifify it with 'column' --}} <x-qform-input type="text" name="prefix[test_other]" column="test2"/>
您也可以为每个输入直接设置数据
<x-qform-input :data="['test' => '1', 'test2' => 2]" type="text" name="prefix[test_other]" column="test2"/>
奖励
您可以使用 blade 函数创建输入
@QFormInput(['type' => 'text', 'name' => 'country', 'data' => $user])
这是另一种方法
<x-qform-input type="text" name="country" :data="$user"/>
其他函数
使用前缀函数并传递一个数组(或传递 null 来清除),它将自动前缀输入名称属性
@QFormData($user) @QFormPrefix(['admin', 'data']) <x-qform-input type="radio" name="level" :variables="$variables"/> {{-- the inputs name attribute will be name="admin[data][level]" --}}
您还可以使用 prefixIn() 和 prefixOut() 添加一组前缀,然后再次退出。可以使用 QForm::prefixReset() 或 @QFormPrefix 无参数来完全清除前缀设置。
@QFormPrefixIn(['admin', 'data']) <x-qform-input type="radio" name="level" :variables="$variables"/> {{-- name will be name="admin[data][name]" --}} <x-qform-input type="text" name="address" /> {{-- name will be name="admin[data][address]" as prefix is retained between inputs--}} @QFormPrefixIn(['preferences']) <x-qform-input type="text" name="email" /> {{-- name will be name="admin[data][preferences][email]" --}} @QFormPrefixOut() <x-qform-input type="text" name="dob" /> {{-- name will be name="admin[data][dob]" so we have gone back to the previous prefix config --}}
定制模板
通过以下方式发布视图
php artisan vendor:publish --tag="qform-views"
您可以直接编辑文件,或者组件模板 "x-qform-input"、"x-qform-error" 和 "x-qform-submit" 支持使用后缀。
创建模板的副本,并添加后缀,例如 input.blade.php 变为 input_bootstrap3.blade.php,然后您可以直接在组件上设置后缀 "bootstrap3",例如 <x-qform-input template="bootstrap3" .../>,或全局通过 QForm::setGlobalTemplate('bootstrap3') 或 @QFormTemplate('bootstrap3')
其他内容
您可以使用 <x-qform-form action="..." > <x-qform-form /> 组件快速创建表单。方法将默认为 POST,并在必要时提供 @csrf 和 @method
许多功能在此处未记录
注释
此代码未经彻底检查,不符合任何标准。按原样提供。