使用 laravel 混合将 Datatables JS 逻辑放在 laravel 的什么地方？

Question

我对这一切都是陌生的。我很抱歉这个奇怪的问题。

我打算使用 Yajra Datatables 包在 Laravel 中显示一些动态 tables。我安装了 Laravel Mix。显然 datatables 需要 js 逻辑才能像 sending/getting 和 ajax 的东西一样工作。

在 Laravel Mix Docs 中说：

Similar to combining stylesheets with mix.styles(), you may also combine and minify any number of JavaScript files with the scripts() method

如果我这样做，我所有需要 js 的页面是否也会包含针对特定 table 的特定数据 table 逻辑？这样可以吗？

我已经混合安装，但我是否仍应在需要时使用 "public/js" 目录来包含这些类型的脚本？

tldr; datatables包需要的js逻辑应该放在laravel?

的什么地方

编辑： 下面是一些示例代码。我应该把这个放在哪里？我可以将其放入相关的 blade 视图中，但这样做是一种好方法吗？

 <script>
   $(document).ready( function () {
    $('#MyDatatable').DataTable({
           processing: true,
           serverSide: true,
           ajax: "{{ url('users-all') }}",
           columns: [{ data: 'id', name: 'id' },
                    { data: 'name', name: 'name' },
                    { data: 'email', name: 'email' },
                    { data: 'created_at', name: 'created_at' }]});});
  </script>

Answer 1

基本上你做的是正确的，但供参考：

1.First 通过 NPM 或 CDN 添加 datatables 到您的项目。（不要忘记 datatables 之前的 jQuery）

CDN

<link rel="stylesheet" href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">

<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

NPM

npm install datatables --save-dev

在您的项目中导入数据表（例如，如果您使用 Laravel 默认值 app.js）

import 'datatables/media/css/jquery.dataTables.css';
import 'datatables';

2.Then 您有多种选择，但您可以在布局文件中添加类似 stack('scripts') 的内容，并将您的脚本包含在 blade 视图中。

例如： master.blade.php（布局示例）

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Layout</title>
</head>
<body>
@yield('content')
@stack('scripts')
</body>
</html>

dashbboard.blade.php（示例页面）

@extends('layouts.master')

@section('content')
<h1>My Awesome Tables</h1>
<div id="MyDatatable"></div>
@endsection

@push('scripts')
    $(document).ready(function () {
        $('#MyDatatable').DataTable({
            processing: true,
            serverSide: true,
            ajax: "{{ url('users-all') }}",
            columns: [{data: 'id', name: 'id'},
                {data: 'name', name: 'name'},
                {data: 'email', name: 'email'},
                {data: 'created_at', name: 'created_at'}]
        });
    });
@endpush

我们应该使用这种方法，因为您使用 {{ url('users-all') }} 所以它必须在 blade 中以便您可以打印它。否则你可以在你的 app.js 上使用它并以其他方式添加你的 url 端点。

使用 laravel 混合将 Datatables JS 逻辑放在 laravel 的什么地方？

Where to put Datatables JS logic in laravel using laravel mix?

php

datatables

laravel

laravel-mix

laravel-5.8