How to add multiple spaces in Vue string

Add multiple spaces to Vue string

In vue, if there are multiple spaces in a character in succession, there is only one space when it is actually displayed.

If you want to display multiple spaces, the character of the space you need to add is: "\xa0", that is, \u00A0

\u00A0 is an uninterrupted space

let sepDot = '\xa0 • \xa0';

Three types of space unicode (\u00A0,\u0020,\u3000)

1. Uninterrupted space \u00A0

2. Half-width space (English symbol) \u0020, commonly used in code

3. Full-width space (Chinese symbol) \u3000, used in Chinese articles

Space symbols in vue

In Vue, you can use space symbols ({{ }}) to render HTML. For example:

<template>
  <div>
    <p>My name is{{ name }}</p>
  </div>
</template>
 
<script>
export default {
  data () {
    return {
      name: 'Xiao Ming'
    }
  }
}
</script>

The rendering result is:

My name is Xiao Ming

In Vue, space symbols ({{ }}) can be used to render various types of data, including strings, numbers, boolean values, arrays, objects, etc.

Summarize

The above is personal experience. I hope you can give you a reference and I hope you can support me more.