title: replace \n to new line on vuejs
body: <p>I am trying to replace \n characters to new line of a data which comes from endpoint.</p>
  
  <hr>
  
  <p>I tried <code>&lt;p&gt;{{ item.licensedocument.legal.documentText.replace(/(?:\r\n|\r|\n)/g, '&lt;br /&gt;') }}&lt;/p&gt;</code> and didn’t worked. Curly brackets stoped working and never acting like JS when i write replace() to the end of the prob.
  Output is like:</p>
  
  <pre><code>    {{ item.licensedocument.legal.documentText.replace(/(?:\r\n|\r|\n)/g, '
  ') }}
  </code></pre>
  
  <hr>
  
  <p>When I write just <code>&lt;p&gt;{{ item.licensedocument.legal.documentText }}&lt;/p&gt;</code> it works and output is like</p>
  
  <pre><code>GENERAL SERVICE AGREEMENT\n\nTHIS GENERAL SERVICE AGREEMENT (the "Agreement") dated this 22nd day of June, 2018\nBETWEEN:\nCLIENT\n______________________\n______________________________\nCONTRACTOR\n______________________\n______________________________\nBACKGROUND\nThe Client is of the opinion that the Contractor has the necessary qualifications, experience and abilities to provide services to the Client.\nThe Contractor is agreeable to providing such services to the Client on the terms and conditions set out in this Agreement.\nIN CONSIDERATION OF the matters described above and of the mutual benefits and obligations set forth in this Agreement, the receipt and sufficiency of which consideration is hereby acknowledged, the Client and the Contractor (individually the "Party" and collectively the "Parties" to this Agreement) agree as follows:\n\nSERVICES PROVIDED \nThe Client hereby agrees to engage the Contractor to provide the Client with the following services (the "Services"):
  </code></pre>
  
  <hr>
  
  <p>I also tried to add a method like:</p>
  
  <pre><code> methods: {
      handleNewLine(str) {
        return str.replace(/(?:\r\n|\r|\n)/g, '&lt;br /&gt;');
      },
    },
  </code></pre>
  
  <p>And called the function like: <code>&lt;p&gt;{{ handleNewLine(item.licensedocument.legal.documentText) }}&lt;/p&gt;</code>
  And output was same:</p>
  
  <pre><code>GENERAL SERVICE AGREEMENT\n\nTHIS GENERAL SERVICE AGREEMENT (the "Agreement") dated this 22nd day of June, 2018\nBETWEEN:\nCLIENT\n______________________\n______________________________\nCONTRACTOR\n______________________\n______________________________\nBACKGROUND\nThe Client is of the opinion that the Contractor has the necessary qualifications, experience and abilities to provide services to the Client.\nThe Contractor is agreeable to providing such services to the Client on the terms and conditions set out in this Agreement.\nIN CONSIDERATION OF the matters described above and of the mutual benefits and obligations set forth in this Agreement, the receipt and sufficiency of which consideration is hereby acknowledged, the Client and the Contractor (individually the "Party" and collectively the "Parties" to this Agreement) agree as follows:\n\nSERVICES PROVIDED \nThe Client hereby agrees to engage the Contractor to provide the Client with the following services (the "Services"):
  </code></pre>
  
  <hr>
  
  <p>I also call like <code>&lt;p v-html="handleNewLine(item.licensedocument.legal.documentText)"&gt;&lt;/p&gt;</code> and <code>&lt;p v-html="item.licensedocument.legal.documentText.replace(/(?:\r\n|\r|\n)/g, '&lt;br /&gt;')"&gt;&lt;/p&gt;</code> and replace() still doesn't work. Output:</p>
  
  <pre><code>GENERAL SERVICE AGREEMENT\n\nTHIS GENERAL SERVICE AGREEMENT (the "Agreement") dated this 22nd day of June, 2018\nBETWEEN:\nCLIENT\n______________________\n______________________________\nCONTRACTOR\n______________________\n______________________________\nBACKGROUND\nThe Client is of the opinion that the Contractor has the necessary qualifications, experience and abilities to provide services to the Client.\nThe Contractor is agreeable to providing such services to the Client on the terms and conditions set out in this Agreement.\nIN CONSIDERATION OF the matters described above and of the mutual benefits and obligations set forth in this Agreement, the receipt and sufficiency of which consideration is hereby acknowledged, the Client and the Contractor (individually the "Party" and collectively the "Parties" to this Agreement) agree as follows:\n\nSERVICES PROVIDED \nThe Client hereby agrees to engage the Contractor to provide the Client with the following services (the "Services"):
  </code></pre>
  
  <hr>
  
  <p>Just found an npm package named <a href="https://www.npmjs.com/package/vue-nl2br" rel="noreferrer">Nl2br</a> but still doesn't work.
  Output is same: </p>
  
  <pre><code>GENERAL SERVICE AGREEMENT\n\nTHIS GENERAL SERVICE AGREEMENT (the "Agreement") dated this 22nd day of June, 2018\nBETWEEN:\nCLIENT\n______________________\n______________________________\nCONTRACTOR\n______________________\n______________________________\nBACKGROUND\nThe Client is of the opinion that the Contractor has the necessary qualifications, experience and abilities to provide services to the Client.\nThe Contractor is agreeable to providing such services to the Client on the terms and conditions set out in this Agreement.\nIN CONSIDERATION OF the matters described above and of the mutual benefits and obligations set forth in this Agreement, the receipt and sufficiency of which consideration is hereby acknowledged, the Client and the Contractor (individually the "Party" and collectively the "Parties" to this Agreement) agree as follows:\n\nSERVICES PROVIDED \nThe Client hereby agrees to engage the Contractor to provide the Client with the following services (the "Services"):
  </code></pre>