Question

当请求是ajax时，我正在渲染内容部分并将其插入DOM。它按预期工作。

然而..我无法找到方法，如何在同一时间内呈现多个部分，例如content和title等。

控制器：

public function awesome(Request $request) {
   if($request->ajax()){
       return view('awesome')->renderSections()['content'];
   }
   return view('awesome');
}

Ajax和pushstate

var load = function (url) {
    $.get(url).done(function (data) {
      $("#content").html(data);
    })
};

$(document).on('click', 'a[data-request="push"]', function (e) {
    e.preventDefault();
    var $this = $(this),
    url = $this.attr("href"),
    title = $this.attr('title');

    history.pushState({
       url: url,
       title: title
    }, title, url);

    // document.title = title;

    load(url);
});

layouts.app

<title>@yield('title')</title>
<meta name="description" content="@yield('desc')"/>

<a data-request="push" title="AWESOME" href="<?= url('/'); ?>/awesome">Awesome</a>
<a data-request="push" title="RANDOM" href="<?= url('/'); ?>/random">Random</a>

<div id="content">
  @yield('content')
</div>

刀片：

@extends('layouts.app')

@section('title', 'Awesome')
@section('desc', 'About awesome')

@section('content')
  some text from awesome page
@endsection

问题：

如何同时渲染它们中的两个或多个？我应该使用数组还是别的什么？请举例或完整解释。

感谢您的回答。

Answer 1

您只需发送标题和内容的json对象，然后使用JS解析数组并提取两个部分。像这样：

<强>控制器

public function awesome(Request $request) {
   if($request->ajax()){
       $view = view('awesome')->renderSections();
       return response()->json([
           'content' => $view['content'],
           'title' => $view['title'],
       ]);
   }
   return view('awesome');
}

Ajax和pushstate

var load = function (url) {
    $.get(url).done(function (data) {
      $("#content").html(data.content);
      document.title = data.title;
    })
};

$(document).on('click', 'a[data-request="push"]', function (e) {
    e.preventDefault();
    var $this = $(this),
    url = $this.attr("href"),
    title = $this.attr('title');

    history.pushState({
       url: url,
       title: title
    }, title, url);

    // document.title = title;

    load(url);
});

在ajax请求上渲染多个刀片视图部分

1 个答案: