Javascript JSON .stringify текст, где \\ n не отображается Javascript строка с новой строкой

Question

Я пытаюсь преобразовать строку в JSON в javascript и отправить строку в элемент textarea HTML. Строка из бэкэнда выглядит следующим образом:

"customBar_query": "select\\n\\neq.Name,\\nAVG(Payload) as [Average Payload]\\n\\nfrom tbl.Cycles as c\\nleft join dim.Equipment as eq on eq.Id = c.Truck_Id\\nwhere c.Timestamp_Loading >= DATEADD(day,-365,GETDATE())\\n\\nGROUP BY eq.Name\\n\\nORDER BY [Average Payload] DESC"

Строка "\\n" должна быть допустимым представлением новой строки.

Я анализирую строку следующим образом:

var newChartData = JSON.parse(data);

Результирующая строка Javascript выглядит следующим образом:

customBar_query: "select\n\neq.Name,\nAVG(Payload) as [Average Payload]\n\nfrom tbl.Cycles as c\nleft join dim.Equipment as eq on eq.Id = c.Truck_Id\nwhere c.Timestamp_Loading >= DATEADD(day,-365,GETDATE())\n\nGROUP BY eq.Name\n\nORDER BY [Average Payload] DESC"

Пока все хорошо. Все в порядке. Однако при просмотре объекта в Инструментах разработчика я не вижу обычного символа «ввода», обозначающего новую строку. При присвоении этого значения текстовой области с помощью jquery .val () текст отображается со строкой «\ n» и, очевидно, без настоящих новых строк, как показано ниже:

select \ n \ neq.Name, \ nAVG (Payload) as [Average Payload] \ n \ nот tbl.Cycles as c \ nleft join dim.Equipment as eq on eq.Id = c .Truck_Id \ nwhere c .Timestamp_Loading> = DATEADD (day, -365, GETDATE ()) \ n \ nGROUP BY eq.Name \ n \ nORDER BY [Средняя полезная нагрузка] DES C

Я просто не могу понять, что здесь происходит . Он не должен действовать таким образом, и я действительно не понимаю, почему он это делает. Мы будем благодарны за любые советы!

ОБНОВЛЕНИЕ

См. Ниже фрагмент из Chrome Developer Tools, чтобы показать, что строка \ n не отображается как ввод "символ

Answer 1

Хорошо, я нашел проблему. Похоже, что '\ n' действительно правильный синтаксис для JSON, который нужно проанализировать в Javascript. Произошло то, что у меня было два разных источника данных, извлекающих из одной и той же функции. Однако разница заключалась в том, что первый был введен через Django ({{dashboardJson | safe}}) в файл HTML, а второй - через Javascript Ajax.

Функция Django '| safe' испортила значения \n, и поэтому мне пришлось отправить \\n, чтобы JSON было действительным. Однако для Javascript Ajax требуется только \n, а не \\n, что приводит к отображению недопустимых строк.

Я понятия не имею, что Django изменилось, поскольку строки мне показались хорошими, однако что-то определенно там произошло.

Answer 2

Значения представляют собой строки. Это еще не новые строки. Также мы ожидаем увидеть символы новой строки, представленные как \ n в строке, и просто новую строку в журнале

Это показывает данные с символами новой строки в текстовом поле

const jsonstring = `{"customBar_query": "select\\n\\neq.Name,\\nAVG(Payload) as [Average Payload]\\n\\nfrom tbl.Cycles as c\\nleft join dim.Equipment as eq on eq.Id = c.Truck_Id\\nwhere c.Timestamp_Loading >= DATEADD(day,-365,GETDATE())\\n\\nGROUP BY eq.Name\\n\\nORDER BY [Average Payload] DESC"}`
const obj = JSON.parse(jsonstring);
const txtArea = document.getElementById("x");
const pre = document.getElementById("output")
Object.values(obj).forEach(val => {
  txtArea.value += val;
  output.textContent += val;
})

console.log(pre.innerHTML)

textarea {
  height: 400px;
  width: 400px;
}