title: Render html from string vuejs
body: <p>I'm struggling with a problem, I want to create a chat app, and the users to be able to tag each other, by using @. For example, user1 type in chat input 'hi @user2', the output should look the same, but '@user2' be a link instead of simple text, I figured how to do that, but the problem is that, if user input for example html tags, it's rendered as html.</p>
  <p>HTML:</p>
  <pre><code>&lt;span v-html=&quot;chatFormat(chat.text)&quot;&gt;&lt;/span&gt;
  </code></pre>
  <p>VUE:</p>
  <pre><code>chatFormat(text) {
    var words = text.split(&quot; &quot;);
    var newStr = '';
    words.forEach(function (word) {
    if (word.includes('@') &gt;= 1) {
      if (word.charAt(0) == '@') {
        word = '{{ &lt;a href=&quot;/user&quot; class=&quot;font-weight-bold&quot; style=&quot;text-decoration:none&quot;&gt;' + word + '&lt;/a&gt; }}';
      }
    }
    newStr = newStr + ' ' + word;
    });
    return newStr;
  }
  </code></pre>