如何在 JS (PHP) 中使用 Laravel Blade答案

【问题标题】：How to use Laravel Blade in JS (PHP)如何在 JS (PHP) 中使用 Laravel Blade
【发布时间】：2019-01-19 09:28:24
【问题描述】：

我正在用 Laravel 5.6 开发一个博客项目。我正在使用 Laravel 内置函数 str_slug() 将标题转换为 slug 和 JavaScript 以使用 JavaScript 的 keyup 函数自动生成 slug。这是我的代码：

var postTitle = $('#post-title');
var postSlug = $('#post-slug');
postTitle.keyup(function() {
    postSlug.val({{ str_slug(postTitle.val()) }});
});

但是，它抛出了一个未知常量的错误。谁能告诉我我想要什么？我是 Laravel 的新手。

【问题讨论】：

这永远不会起作用，str_slug 是一个 PHP 函数，它在发送到客户端之前在服务器上进行评估。发出 Ajax 请求或使用 javascript slug 生成器是您最好的两个选择。
你能给我介绍一个 JS 帮助函数，它可以在 slug 中转换标题
给你：npmjs.com/package/slugify
感谢兄弟的帮助！

标签： javascript php jquery laravel laravel-blade

【解决方案1】：

您可以使用 html 标记来完成此操作。在 html 标记中创建一个隐藏输入并在 post-title 上输入 str_str() 操作的值，并在您的 js 中将 post-slug 输入值设置为 keyup 上的值。

<input type="text" id="post-title" value="{{$title}}">
<input type="hidden" id="hidden-post-title" value="{{str_slug($title)}}">

var postTitle = $('#post-title');
var postSlug = $('#post-slug');
postTitle.keyup(function() {
    postSlug.val($('#hidden-post-title').val());
});

【讨论】：

【解决方案2】：

这是一个在 JS 中创建 slug 的简单函数：

function slugify(text)
{
  return text.toString().toLowerCase()
    .replace(/\s+/g, '-')           // Replace spaces with -
    .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
    .replace(/\-\-+/g, '-')         // Replace multiple - with single -
    .replace(/^-+/, '')             // Trim - from start of text
    .replace(/-+$/, '');            // Trim - from end of text
}

Source Gist

【讨论】：