Laravel 5.4 - 如何在 javascript 加载之前使 @section 屈服
Posted
技术标签:
【中文标题】Laravel 5.4 - 如何在 javascript 加载之前使 @section 屈服【英文标题】：Laravel 5.4 - How to make @section yield before javascript loads 【发布时间】：2020-05-03 17:13:11 【问题描述】：我正在使用 javascript 动态创建一个表单，该表单从聊天中获取答案并将其添加到表单中。该表单存在于单独的刀片文件register.blade.php 中。我在主页 (index.blade.php) 中生成了表单，但 @section('registration-form') 在读取 js 之前生成了页面。出于这个原因，来自聊天的答案永远不会输入到表单中。
register.blade.php 持有（自定义）表单@section('registration-form')。从那里我想在routes/web.php 中创建一个route::get('/index', 'CustomAuthController') 来将表单数据存储在我的数据库中。关于如何完成这项工作的任何想法？
对 Laravel 非常陌生。使用 Laravel 5.4。
代码：
布局/app.blade.php
@include('includes.head')
<body>
@include('includes.navbar')
<div class="container">
@yield('content')
</div>
@include('includes.footer')
</body>
index.blade.php
@extends('layouts.app')
@section('content')
<main>
<section class="row" >
<!------ a bunch of content here ----------->
<!----- form yielded here -------->
@yield('registration-form')
<!--- form end ----->
<!------ more content -------->
</section>
</main>
@endsection
register.blade.php
@section('registration-form')
<div class="padding-32" id="signup-two">
<h4>Review and submit your information</h4>
<form method="POST" action=" route('signup') ">
csrf_field()
<div class="form-group" id="fname">
<label></label>
<input name="fname"/>
</div>
<div class="form-group" id="email">
<label></label>
<input name="email"/>
</div>
<div class="form-group" id="password">
<label></label>
<input name="password"/>
</div>
<div class="form-group" id="BMI">
<label></label>
<input name="BMI"/>
</div>
<div class="form-group" id="height">
<label></label>
<input name="height"/>
</div>
<div class="form-group" id="weight">
<label></label>
<input name="weight"/>
</div>
</form>
@endsection
我尝试在app.blade.php 中生成@section(registration-form)，但表单仍然没有加载。我也不知道如何为此创建路由和控制器。代码如下所示：
布局/app.blade.php
@include('includes.head')
<body>
@include('includes.navbar')
<div class="container">
@yield('content')
@yield('registration-form')
</div>
@include('includes.footer')
</body>
</html>
路由/web.php
Route::get('/index', function ()
return view('registration-form', [
'fname' => 'fname',
'BMI' => 'BMI',
'height' => 'height',
'weight' => 'weight'
]);
);
【问题讨论】：
如果 js 是专门用于注册表单的，为什么不创建另一个 js 文件并在内部添加和加载脚本（在底部）@section('registration-form')。
你的registration-form是什么样的？
就在上面的register.blade.php下面的代码块中。我将它包裹在@section（'registration-form'）中，并尝试在 index.blade.php 中生成它。
@yunhai 我的 JavaScript 会计算并制作和移动页面上的对象，因此我无法将表单的 js 移动到单独的文件中。
@bella 你的问题比较混乱，你想在@yield(form) 之前还是之后加载js。看起来问题的标题和你想要接近的东西是自相矛盾的。您可能想稍微修改一下您的问题。
【参考方案1】：
Javascript 通常在 dom 准备好时加载。
但是您想在特定的 DOM (@yield(form)) 元素准备好之前加载脚本。
所以你必须做一些类似“laravel load view using ajax”的事情，周围已经有一些实际的例子。 How can I return a view from an AJAX call in Laravel 5?
你想为 Ajax 调用创建一个路由器，控制器函数返回部分视图（因此@section('form')）。在您的 js 中准备好必要的代码后调用 ajax。然后将视图附加到所需位置。没有捷径可走。
您可能想重新考虑您现在要完成的任何设计。
对于数据操作、计算等。如果可以由后端完成和验证，只需将它们发送到后端即可。一个常见的错误是前端试图处理后端任务。
【讨论】：
lml 现在我要学习AJAX了！！我可能在短时间内编码时使用了它两次。我想要干净的代码，所以重新设计可能是我最好的选择。您的反馈有所帮助。希望我明天能解决这个问题。会尽量记住给您发送成品的链接。以上是关于Laravel 5.4 - 如何在 javascript 加载之前使 @section 屈服的主要内容，如果未能解决你的问题，请参考以下文章