- Vue.js 2 Web Development Projects
- Guillaume Chau
- 146字
- 2021-07-02 22:34:25
Displaying HTML
Now that we know that text interpolations can't render HTML for security reasons, we will need another way to render dynamic HTML--the v-html directive. Like the v-model directive we saw in Chapter 1, Getting Started with Vue, this is a special attribute that adds a new feature to our template. This one is able to render any valid HTML string into our app. Just pass the string as the value, as follows:
<!-- Preview pane --> <aside class="preview" v-html="notePreview"> </aside>
Now, the markdown preview should work correctly, and the HTML is dynamically inserted in our page.
Any content inside our aside element will be replaced by the value of the v-html directive. You can use this to put placeholder contents inside.
Here is the result you should have:

There is an equivalent directive for text interpolation, v-text, which behaves like v-html, but escapes the HTML tags just like classic text interpolations.
- UI設(shè)計(jì)基礎(chǔ)培訓(xùn)教程
- OpenShift開(kāi)發(fā)指南(原書(shū)第2版)
- C#完全自學(xué)教程
- aelf區(qū)塊鏈應(yīng)用架構(gòu)指南
- 從學(xué)徒到高手:汽車(chē)電路識(shí)圖、故障檢測(cè)與維修技能全圖解
- Hands-On GPU:Accelerated Computer Vision with OpenCV and CUDA
- Mastering Python Networking
- Windows Server 2016 Automation with PowerShell Cookbook(Second Edition)
- Mastering Apache Spark 2.x(Second Edition)
- 程序是怎樣跑起來(lái)的(第3版)
- C語(yǔ)言程序設(shè)計(jì)教程
- FPGA Verilog開(kāi)發(fā)實(shí)戰(zhàn)指南:基于Intel Cyclone IV(進(jìn)階篇)
- Advanced UFT 12 for Test Engineers Cookbook
- Android應(yīng)用開(kāi)發(fā)實(shí)戰(zhàn)
- Keil Cx51 V7.0單片機(jī)高級(jí)語(yǔ)言編程與μVision2應(yīng)用實(shí)踐