Vue中{{}}、v-text和v-html
阿新 • • 發佈：2020-12-28
技術標籤：Vue
區別：
- {{}}和v-text會將元素當成純文字輸出
- v-html會將元素當成html標籤解析後輸出(即:可以識別元素中的標籤)
示例程式碼：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="app"> <div>{{ msg }}</div> <div v-text="msg"></div> <div v-html="msg"></div> </div> </body> <script src="../js/vue.js"></script> <script> new Vue({ el:"#app", data:{ msg: "<span>hello world!</span>" } }) </script> </html>
最終效果如圖所示:
