Почему некоторые строки содержат "" и некоторые "", когда мой ввод одинаков ("")?

Question

Моя проблема возникает, когда я пытаюсь использовать некоторые данные / строки в p-элементе.

Я начинаю с таких данных:

data: function() {
  return {
    reportText: {
      text1: "This is some subject text",
      text2: "This is the conclusion",
    }
  }
}

Я использую эти данные в моем (vue -) html:

<p> {{ reportText.text1 }} </p>
<p> {{ reportText.text2 }} </p>

В моем браузере, когда я проверяю свои элементы, я вижу следующие результаты:

<p>This&nbsp;is&nbsp;some&nbsp;subject&nbsp;text</p>
<p>This is the conclusion</p>

Как вы можете видеть, внезапно возникает разница, один элемент p использует  , а другой , хотя я начал с обеих строк, используя . Я знаю, что   и технически представляют одну и ту же вещь, но проблема со строкой   заключается в том, что она обрабатывается как строка с 1 большим словом вместо нескольких отдельных слов. Это портит мой макет, и я не могу решить это, используя определенные свойства css (word-wrap et c.)

Другие вещи, которые я пробовал:

• Попытка санации строк с помощью .replace ( , ), но это ничего не делает. Я предполагаю, что это потому, что это в основном то же самое, так что заменить нечего. По той же причине, по которой я должен использовать blockcode в stackoverflow, чтобы определить между 1025 * и .
• Записал данные из vue, чтобы увидеть, есть ли заметная разница, но я не могу увидеть любой. Если я регистрирую data / reportText, я снова вижу только строку с s

Поэтому у меня возникают следующие вопросы:

1. Почему это происходит? Я не могу найти никакого логического объяснения, почему он иногда использует , а иногда использует  , это кажется случайным, но я уверен, что я что-то упускаю.
2. Любые другие вещи Я мог бы попытаться следовать по пути, по которому идет моя строка, чтобы я мог видеть, где происходит преобразование из в  ?

Answer 1

Согласно комментариям, разработанное решение оказалось простой заменой символов Юникода, нацеленной на кодовую точку \u00A0 Юникода (т.е. замену неразрывных пробелов Юникода обычными пробелами):

str.replace(/[\\u00A0]/g, ' ')

Объяснение:

JavaScript обычно позволяет использовать символы Юникода двумя способами: вы можете непосредственно ввести визуализированный символ или использовать кодовую точку Юникода (т. Е. В случае JavaScript шестнадцатеричный код с префиксом с \u как \u00A0). Он не имеет понятия сущности HTML (т. Е. Последовательности символов между & и ;, как  ).

Инструмент инспектора для некоторых браузеров, однако, использует HTML концепция сущности HTML и часто отображает символы Юникода, используя соответствующие им сущности HTML, где это применимо. Если вы проверите тот же исходный код в Chrome по сравнению с Firefox в качестве инспектора (во всяком случае, на момент написания этого ответа), вы увидите, что Chrome использует HTML сущностей, а Firefox использует результат визуализации символа. Хотя это удобная функция, позволяющая видеть непечатные символы Юникода в инспекторе, использование Chrome сущностей HTML является лишь вспомогательной функцией, а не отражением фактического содержимого вашего исходного кода.

Имея это в виду, мы можем сделать вывод, что ваш исходный код содержит символы Юникода в их полностью визуализированной форме. Независимо от формы вашего символа Юникод, исправление идентично: вам нужно явно указать эти символы пространства Юникода и заменить их обычными пробелами.