How to get around the issue of quotes inside quotes?

Question

JavaScript

Vue.component('Media',{
  props: {
    order: String
  },
  computed: {
    media(){
      return media.find(item => item.order === this.order);
    }
  },
  mounted(){
    console.log(this.order)
  },

  template: `<div class="media-box">
            <div class="media-img" v-bind:style="{background: `url(img/advantage/${order}-mini.jpg) no-repeat`}" ></div>
            <div class="media-info">
              <div class="media-title">{{media.title}}</div>
              <div class="media-text">{{media.text}}</div>
              <a :href="media.link" class="more-button media-btn">Подробнее</a>
            </div>
            </div>`
});

Here is the component, its template in slash quotes - and slash quotes are still used inside, but everything breaks from this, how can I get around this? Please do not suggest to make a script in the tag or add a constant. I want to know exactly how to make slash quotes inside slash quotes without breaking the script.

Answer 1

\`
https://learn.javascript.ru/string#spetssimvoly