php - Laravel PHP表单提交，显示结果时破坏文本？

Question

所以我有一个待办事项列表和非常奇怪的问题。

所以我有一个表单，用户编写标题和任务描述，任务描述作为文本区域完成，之后用户按下提交按钮并提交任务，然后将用户重定向到“主页”并显示所有待处理的任务。

问题是当用户在 texarea 内按下“ENTER”时，文本“中断”并且与 HTML div 标签不对齐。（如下图所示（TASK 3 和 TASK 2））

这是我的“显示所有任务”代码

>  @foreach ($tasks as $task)
>         <div class="Task">
>             <h1>{{ $task->TaskName }}</h1>
>             <div class="TaskDescription">
>                 <p>{{ $task->TaskDescription }}</p>
>             </div>
>         </div>
>     @endforeach

，这是我的“创建新任务”表格

<div class="FormContainer">
<form method="POST" action="/tasks" class="form_group_vertical">
    @csrf
    <input name="TaskName" placeholder="Task name..." class="lineInput">
    <textarea name="TaskDescription" placeholder="Task description..." class="Form_TextArea"></textarea>

    <button class="btn_submit" type="submit">Create new Task</button>

</form>

这就是我存储所有任务的方式

    public function storeTasks(){
  //  return request()->all(); data displayed in JSON

  Task::create([
      'TaskName' => request('TaskName'),
      'TaskDescription' => request('TaskDescription')
  ]);

  return redirect('/tasks');
}

这是我的向上迁移功能

    public function up()
{
    Schema::create('tasks', function (Blueprint $table) {
        $table->id();
        $table->string('TaskName');
        $table->text('TaskDescription');
        $table->timestamps();
    });
}

到目前为止，我已经尝试过更改数据的保存方式，尝试将 {{ }} 替换为 {!! !!}，尝试更改数据库，并尝试完全重写表单 - 我找不到这种方法的任何修复。

标签： phpsql-serverlaravelformslaravel-blade

Answer 1

使用nl2br

  @foreach ($tasks as $task)
         <div class="Task">
             <h1>{{ $task->TaskName }}</h1>
             <div class="TaskDescription">
                 <!-- Change here -->
                 <p>{!! nl2br(trim($task->TaskDescription)) !!}</p>
                 <!-- OR -->
                 <p>{!! str_replace(array("\r\n", "\r", "\n"), "<br />", $task->TaskDescription) !!}</p>
             </div>
         </div>
  @endforeach