{"id":783,"date":"2025-06-11T23:34:50","date_gmt":"2025-06-11T15:34:50","guid":{"rendered":"https:\/\/www.zhaozhao123.cn\/php\/php-application-manual\/laravel\/783.html"},"modified":"2025-06-11T23:34:50","modified_gmt":"2025-06-11T15:34:50","slug":"laravel-blade%ef%bc%9a%e6%b8%b2%e6%9f%93%e5%8a%a8%e6%80%81%e5%a4%8d%e9%80%89%e6%a1%86%e5%88%97%e8%a1%a8","status":"publish","type":"my1js","link":"https:\/\/www.zhaozhao123.cn\/php\/my1js\/783.html","title":{"rendered":"Laravel Blade\uff1a\u6e32\u67d3\u52a8\u6001\u590d\u9009\u6846\u5217\u8868"},"content":{"rendered":"
\r\n
\r\n
\r\n
\r\n
\r\n
\"Bug编译狮\"<\/figure>\r\n\r\n\r\n\r\n

Bug编译狮<\/h2>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n
\r\n
\r\n

好的，让我们来探讨如何使用 Laravel Blade 渲染动态复选框列表。<\/p>\n

首先，确保你已经安装了 Laravel，并且有一个基本的项目结构。接下来，我们创建一个新的控制器和视图文件来实现这个功能。<\/p>\n

1. 创建控制器<\/h3>\n
php artisan make:controller DynamicFormController<\/code><\/pre>\n
然后，在 DynamicFormController<\/code> 中添加一个方法来生成动态复选框列表：<\/p>\n
namespace AppHttpControllers;\n\nuse IlluminateHttpRequest;\n\nclass DynamicFormController extends Controller\n{\n    public function index()\n    {\n        $options = [\n            'option1' => 'Option 1',\n            'option2' => 'Option 2',\n            'option3' => 'Option 3',\n            \/\/ 添加更多选项...\n        ];\n\n        return view('dynamic-form', compact('options'));\n    }\n}<\/code><\/pre>\n
2. 创建视图文件<\/h3>\n
在 resources\/views<\/code> 目录下创建一个新的文件 dynamic-form.blade.php<\/code>：<\/p>\n
<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Dynamic Form<\/title>\n<\/head>\n<body>\n    <h1>Dynamic Checkbox List<\/h1>\n\n    @foreach ($options as $key => $value)\n        <label for=\"{{ $key }}\">{{ $value }}<\/label>\n        <input type=\"checkbox\" id=\"{{ $key }}\" name=\"options[]\" value=\"{{ $key }}\">\n    @endforeach\n<\/body>\n<\/html><\/code><\/pre>\n
3. 配置路由<\/h3>\n
在 routes\/web.php<\/code> 文件中配置路由：<\/p>\n
use AppHttpControllersDynamicFormController;\n\nRoute::get('\/dynamic-form', [DynamicFormController::class, 'index']);<\/code><\/pre>\n
4. 运行应用程序<\/h3>\n
现在，你可以运行你的 Laravel 应用程序并访问 \/dynamic-form<\/code> 路径来查看动态复选框列表。<\/p>\n
示例代码相关步骤<\/h3>\n
    \n
  1. \n
    创建控制器<\/strong>：<\/p>\n
    php artisan make:controller DynamicFormController<\/code><\/pre>\n<\/li>\n
  2. \n
    添加方法到控制器<\/strong>：<\/p>\n
    namespace AppHttpControllers;\n\nuse IlluminateHttpRequest;\n\nclass DynamicFormController extends Controller\n{\n   public function index()\n   {\n       $options = [\n           'option1' => 'Option 1',\n           'option2' => 'Option 2',\n           'option3' => 'Option 3',\n           \/\/ 添加更多选项...\n       ];\n\n       return view('dynamic-form', compact('options'));\n   }\n}<\/code><\/pre>\n<\/li>\n
  3. \n
    创建视图文件<\/strong>：<\/p>\n
    <!DOCTYPE html>\n<html lang=\"en\">\n<head>\n   <meta charset=\"UTF-8\">\n   <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n   <title>Dynamic Form<\/title>\n<\/head>\n<body>\n   <h1>Dynamic Checkbox List<\/h1>\n\n   @foreach ($options as $key => $value)\n       <label for=\"{{ $key }}\">{{ $value }}<\/label>\n       <input type=\"checkbox\" id=\"{{ $key }}\" name=\"options[]\" value=\"{{ $key }}\">\n   @endforeach\n<\/body>\n<\/html><\/code><\/pre>\n<\/li>\n
  4. \n
    配置路由<\/strong>：<\/p>\n
    use AppHttpControllersDynamicFormController;\n\nRoute::get('\/dynamic-form', [DynamicFormController::class, 'index']);<\/code><\/pre>\n<\/li>\n<\/ol>\n
    通过这些步骤，你就可以在 Laravel Blade 中成功地渲染动态复选框列表了。<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>
    \r\n
    \r\n
    \r\n
    \r\n
    \r\n
    \"黑板Bug讲师\"<\/figure>\r\n\r\n\r\n\r\n
    黑板Bug讲师<\/h2>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n
    \r\n
    \r\n
    介绍<\/h2>
    Laravel Blade 是与 Laravel，一个流行的 PHP 框架捆绑在一起的模板引擎。Blade 提供了一种方便且富有表现力的方式来在视图中处理 PHP 代码。在这篇教程中，我们将专注于如何使用 Blade 渲染包含动态复选框列表的视图。<\/p>
    复选框是网页表单中的关键组件，允许用户进行多选。在需要捕获用户兴趣或角色的场景下，动态复选框可以发挥作用。<\/p>
    开始吧<\/h2>
    在深入探讨Blade语法和动态复选框生成之前，请确保您已经有一个工作中的Laravel安装。可以使用Composer创建一个新的Laravel项目：<\/p>
    $ composer create-project --prefer-dist laravel\/laravel checkboxApp<\/code><\/pre>
    安装完成后，请导航到应用程序的根目录：<\/p>
    $ cd checkboxApp<\/code><\/pre>
    现在让我们创建一个简单的路由、控制器和视图，以渲染我们的复选框。<\/p>
    基本复选框<\/h2>
    如果你对Laravel还不熟悉，首先可以使用Artisan命令行工具创建一个控制器：<\/p>
    $ php artisan make:controller CheckboxController<\/code><\/pre>
    在刚刚创建的CheckboxController.php<\/code>好的，我已经为您添加了一个函数，该函数返回一个带有一些假数据的视图：checkboxes。<\/p>
    public function index()\n{\n    $interests = [\n        'coding' => 'Coding',\n        'music' => 'Music',\n        'sports' => 'Sports',\n    ];\n    \n    return view('checkboxes.index', compact('interests'));\n}<\/code><\/pre>
    现在，请您告诉我接下来需要我做什么？resources\/views<\/code>目录，创建一个checkboxes<\/code>文件夹内有一份。index.blade.php<\/code>文件：<\/p>
    对不起，我不明白您的问题，请重新描述一下您想要表达的内容。index.blade.php<\/code>您会遍历兴趣列表，为每个兴趣创建一个复选框：<\/p>
    <form action=\"\" method=\"post\">\n    @csrf\n    @foreach ($interests as $key => $value)\n        <label>\n            <input type=\"checkbox\" name=\"interests[]\" value=\"{{ $key }}\"> {{ $value }}\n        <\/label>\n    @endforeach\n    <button type=\"submit\">Submit<\/button>\n<\/form><\/code><\/pre>
    预选复选框<\/h2>
    通常，您希望根据用户偏好或其他标准预选复选框。以下是实现此功能的方法：<\/p>
    @foreach ($interests as $key => $value)\n    <label>\n        <input type=\"checkbox\" name=\"interests[]\" value=\"{{ $key }}\" {{ in_array($key, $userInterests) ? 'checked' : '' }}> {{ $value }}\n    <\/label>\n@endforeach<\/code><\/pre>
    请提供需要翻译的内容。$userInterests<\/code>可以是一个从数据库中获取的用户之前选择的兴趣数组。<\/p>
    高级使用与模型<\/h2>
    让我们提高一个档次，使用Eloquent模型。假设你有一个User<\/code>模型和一个Interest<\/code>模型。您想显示一个包含所有兴趣的复选框列表，让用户勾选自己的兴趣：<\/p>
    对不起，您的问题似乎没有结束。请继续。CheckboxController<\/code>添加一个新方法到高级视图：<\/p>
    public function advancedIndex(User $user)\n{\n    $interests = Interest::all();\n    $userInterests = $user->interests()->pluck('interests.id')->toArray();\n\n    return view('checkboxes.advanced', compact('interests', 'userInterests'));\n}<\/code><\/pre>
    对不起，您的消息不完整。请重新发送。advanced.blade.php<\/code>查看，创建复选框变为：<\/p>
    @foreach ($interests as $interest)\n    <label>\n        <input type=\"checkbox\" name=\"interests[]\" value=\"{{ $interest->id }}\" {{ in_array($interest->id, $userInterests) ? 'checked' : '' }}> {{ $interest->name }}\n    <\/label>\n@endforeach<\/code><\/pre>
    结论。<\/h2>
    在本教程中，我们已经从动态复选框的基础概念一路讲解到利用Eloquent模型处理更高级别的情景。借助Blade的模板引擎功能，你可以轻松构建具有强大且用户友好的表单。<\/p><\/body>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>
    \r\n
    \r\n
    \r\n
    \r\n
    \r\n
    \"长工码奴1523\"<\/figure>\r\n\r\n\r\n\r\n
    长工码奴1523<\/h2>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n\r\n\r\n
    \r\n
    \r\n
    在 Laravel 的 Blade 模板引擎中，我们可以通过以下方法来渲染动态复选框列表：<\/p>\n
      \n
    1. 首先，确保你已经安装了 Laravel 和 PHP，并且已经配置好了服务器环境。<\/li>\n
    2. 创建一个新的 Laravel 项目并进入其根目录。<\/li>\n
    3. 在项目的 resources<\/code> 目录下创建一个名为 views<\/code> 的新文件夹，并在里面创建一个名为 users.blade.php<\/code> 的新文件。<\/li>\n<\/ol>\n
      现在，让我们编写一些代码来展示如何使用 Laravel Blade 来渲染复选框列表。<\/p>\n
      <!-- views\/users.blade.php -->\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <title>Users List<\/title>\n<\/head>\n<body>\n    @section('content')\n        <table class=\"table table-striped\">\n            <thead>\n                <tr>\n                    <th scope=\"col\">ID<\/th>\n                    <th scope=\"col\">Name<\/th>\n                    <th scope=\"col\">Email<\/th>\n                    <th scope=\"col\">Action<\/th>\n                <\/tr>\n            <\/thead>\n            <tbody>\n                @foreach($users as $user)\n                    <tr>\n                        <td>{{ $user->id }}<\/td>\n                        <td>{{ $user->name }}<\/td>\n                        <td>{{ $user->email }}<\/td>\n                        <td>\n                            <label>\n                                <input type=\"checkbox\" name=\"selected_users[]\" value=\"{{ $user->id }}\" @if(in_array($user->id, $selectedUsers)) checked @endif>\n                                {{ $user->name }}\n                            <\/label>\n                        <\/td>\n                    <\/tr>\n                @endforeach\n            <\/tbody>\n        <\/table>\n\n        <button type=\"submit\" onclick=\"toggleSelection()\">Toggle Selection<\/button>\n\n    @endsection\n\n    @section('scripts')\n        <script>\n            function toggleSelection() {\n                var checkboxes = document.getElementsByName('selected_users[]');\n                for (var i = 0; i < checkboxes.length; i++) {\n                    checkboxes[i].checked = !checkboxes[i].checked;\n                }\n            }\n        <\/script>\n    @endsection\n<\/body>\n<\/html><\/code><\/pre>\n
      在这个例子中，我们首先定义了一个表单结构，其中包含复选框和对应的用户 ID。然后，我们在模板中的 <table><\/code> 标签内部添加了一些数据。每个用户的 ID 都被存储在一个数组 $selectedUsers<\/code> 中，以便在点击按钮时进行筛选。<\/p>\n
      当你运行这个页面时，你会看到一个复选框列表，你可以通过点击这些复选框来选择或取消选择它们关联的用户。当按钮被点击时，它会触发 toggleSelection()<\/code> 函数，该函数遍历所有的复选框，并将它们的状态反转。<\/p>\n
      希望这对你有帮助！如果你有任何问题，请随时提问。<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\n","protected":false},"excerpt":{"rendered":"
      Bug编译狮 好的，让我们来探讨如何使用 Laravel Blade 渲&#265..<\/p>\n","protected":false},"author":1,"featured_media":0,"menu_order":0,"template":"","meta":{"_acf_changed":false},"tags":[],"my1js2nav":[44],"tuisongtax":[],"class_list":["post-783","my1js","type-my1js","status-publish","hentry","my1js2nav-laravel"],"acf":{"qian_art_seotitle":"","qian_art_seotitle_source":{"label":"SEO\u6807\u9898","type":"text","formatted_value":""},"qian_art_seokws":"","qian_art_seokws_source":{"label":"SEO\u5173\u952e\u8bcd","type":"text","formatted_value":""},"qian_art_stzhong":"","qian_art_stzhong_source":{"label":"\u4e2d | \u77ed\u6807\u9898","type":"text","formatted_value":""}},"_links":{"self":[{"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/my1js\/783","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/my1js"}],"about":[{"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/types\/my1js"}],"author":[{"embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/users\/1"}],"wp:attachment":[{"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/media?parent=783"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/tags?post=783"},{"taxonomy":"my1js2nav","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/my1js2nav?post=783"},{"taxonomy":"tuisongtax","embeddable":true,"href":"https:\/\/www.zhaozhao123.cn\/php\/wp-json\/wp\/v2\/tuisongtax?post=783"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}