2016-09-27 72 views
0

如何讓vue.js完全忽略HTML塊?現在它正試圖解析什麼是在textarea的當我需要它被忽略:Vue.js忽略textarea中的html

<textarea class="form-control" required="true" name="template_code" cols="50" rows="10">&lt;div style=&quot;width:300px;margin:0;padding:0;font-family:sans-serif;&quot;&gt; 
 

 
    &lt;a href=&quot;{!! $dealer-&gt;url !!}&quot; style=&quot;line-height:0;&quot; target=&quot;_blank&quot;&gt; 
 
      &lt;img src=&quot;{!! url(&#039;/&#039;) !!}/image_assets/dads/{{$ad-&gt;id}}/Top Image?time=&lt;?php echo md5($ad-&gt;updated_at); ?&gt;&quot; style=&quot;margin:0;padding:0;display:block;max-width:100%;&quot;&gt; 
 
    &lt;/a&gt; 
 

 
    &lt;div class=&quot;inventory-listings&quot; style=&quot;background:#{{ $ad-&gt;custom_settings[&#039;Border Color&#039;] }};padding:2px;height:246px;&quot;&gt; 
 
     &lt;div class=&quot;inventory-inner&quot; style=&quot;background:#ffffff;padding:6px;&quot;&gt; 
 
      &lt;p style=&quot;font-size:10px;letter-spacing:1px;text-transform:uppercase;text-align:center;margin:6px 0;&quot;&gt;Featured 
 
       Inventory&lt;/p&gt; 
 

 
      @foreach ($items as $item) 
 
       &lt;div style=&quot;margin:1px 0;padding: 3px 0;border-top:1px solid #{{ $ad-&gt;custom_settings[&#039;Divider Color&#039;] }};&quot;&gt; 
 
        &lt;a href=&quot;{!! $item[&#039;url&#039;] !!}&quot; 
 
         style=&quot;display:block;text-decoration:none;overflow:auto;color:#{{ $ad-&gt;custom_settings[&#039;Link Item Color&#039;] }};&quot; target=&quot;_blank&quot;&gt; 
 
         &lt;div class=&quot;img-holder&quot; style=&quot;width: 20%;&quot;&gt; 
 
          &lt;img src=&quot;{!! action(&#039;[email protected]&#039;, [&#039;id&#039; =&gt; $item[&#039;image_id&#039;]]) !!}/&quot; 
 
           style=&quot;margin:0;padding:0;display:block;float:left;margin-right:8px;max-width:100%;border-radius:4px;&quot;&gt; 
 
         &lt;/div&gt; 
 
         &lt;p style=&quot;margin: 4px 0 0 0;font-size:14px;&quot;&gt;{!! $item[&#039;year&#039;] !!} {!! $item[&#039;make_name&#039;] !!} {!! $item[&#039;model_name&#039;] !!} 
 
         &lt;/p&gt; 
 
        &lt;/a&gt; 
 
       &lt;/div&gt; 
 

 
      @endforeach 
 

 
     &lt;/div&gt; 
 
    &lt;/div&gt; 
 

 
    &lt;a href=&quot;{!! $dealer-&gt;url !!}&quot; style=&quot;line-height:0;&quot; target=&quot;_blank&quot;&gt; 
 
      &lt;img src=&quot;{!! url(&#039;/&#039;) !!}/image_assets/dads/{{$ad-&gt;id}}/Bottom Image?time=&lt;?php echo md5($ad-&gt;updated_at); ?&gt;&quot; style=&quot;margin:0;padding:0;display:block;max-width:100%;&quot;&gt; 
 
    &lt;/a&gt; 
 
&lt;/div&gt; 
 
</textarea>

+0

你得到什麼具體錯誤? – ceejayoz

回答

4

使用v-pre指令:

<textarea v-pre class="form-control" name="template_code"> 
    contents will not be parsed 
</textarea> 

文檔:https://vuejs.org/api/#v-pre