javascriptvue.jsjavascript-objectssubscriptsup

How to add a subscript symbol in Vue.js


I want to add this ® subscript symbol after SAP. How can I do it?

{
    number: '02',
    title: 'Multiple Automation Agents ',
    descriptionTwo: [
        'Achieve 100% savings on infra scaling & Additional SOX Cost',
        'Eliminate GUI based automation for SAP with SAP NetWeaver ABAP Automation Studio ',
        'Realize speed and reliability with Low-code RPA Agent employing libraries as opposed to traditional coding',
        'Conquer challenges of automation in API based systems like ServiceNow, Salesforce with API Agent',
    ],
},

The same this in HTML: SAP<sup>®</sup>


Solution

  • Working Demo:

    new Vue({
      el: '#app',
      data: {
        message: {
          number: '02',
          title: 'Multiple Automation Agents ',
          descriptionTwo: [
            'Achieve 100% savings on infra scaling & Additional SOX Cost',
            'Eliminate GUI based automation for SAP<sup>®</sup> with SAP<sup>®</sup> NetWeaver ABAP Automation Studio ',
            'Realize speed and reliability with Low-code RPA Agent employing libraries as opposed to traditional coding',
            'Conquer challenges of automation in API based systems like ServiceNow, Salesforce with API Agent',
          ]
        }
      }
    })
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
    <div id="app">
      <ul v-for="(item, index) in message.descriptionTwo" :key="index">
        <li v-html="item"></li>
      </ul>
    </div>