title: How to use Vue.js variable in style attribute?
body: <p>I need to find a way to use a VueJS variable in a style attribute, as example when I try something like <code>&lt;p style="color:[% randomColor() %];&gt;&lt;/p&gt;</code> it dissapears on my console.</p>
  
  <p>Here's an example on fiddle : <a href="https://jsfiddle.net/Lindow/bjfvdgde/3/" rel="nofollow noreferrer">https://jsfiddle.net/Lindow/bjfvdgde/3/</a></p>
  
  <p><strong>HTML :</strong> </p>
  
  <pre><code>&lt;div id="app"&gt;
      &lt;p style="color:[% randomColor() %];"&gt;[% nameAttr() %]&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JavaScript :</strong></p>
  
  <pre><code>var color = new Vue({
      el:'#app',
      methods:{
          nameAttr:function(){
            var name = 'John Doe';
            return name 
          },
          randomColor:function(){
              var font_color = "red";
              return font_color
          }
    },
    delimiters: ["[%","%]"]
  });
  </code></pre>
  
  <p>How can I get around this problem ?</p>