Vue入门-指令学习-v-html

v-html:

作用:设置元素的innerHTML,动态解析标签

语法:v-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>
    
    <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.7.16/dist/vue.js"></script> -->
</head>
<body>
    <div id="app">
        <div v-html="msg"></div>
    </div>

    <script src="js/vue.js"></script>

    <script>
        const app = new Vue({
            //通过el配置选择器,指定Vue管理的是哪个盒子
            el:'#app',
            //通过data提供数据
            data: {
       msg: '<a href="https://www.baidu.com">百度</a>'
   }

        })
    </script>
</body>
</html>

页面效果:

相关推荐
我命由我123454 分钟前
Photoshop - Photoshop 工具栏(10)透视裁剪工具
经验分享·笔记·学习·ui·职场和发展·职场发展·photoshop
ziyue757517 分钟前
vue修改element-ui的默认的class
前端·vue.js·ui
sensen_kiss31 分钟前
INT301 Bio-computation 生物计算(神经网络)Pt.1 导论与Hebb学习规则
人工智能·神经网络·学习
树叶会结冰38 分钟前
HTML语义化:当网页会说话
前端·html
koko421 小时前
天津小公司面经
java·学习·面试
程序定小飞2 小时前
基于springboot的在线商城系统设计与开发
java·数据库·vue.js·spring boot·后端
七夜星七夜月2 小时前
生成与无监督学习 —— 奶茶店的 “新品研发与原料优化体系”
学习
BumBle2 小时前
uniapp 用css实现圆形进度条组件
前端·vue.js·uni-app
iconball3 小时前
个人用云计算学习笔记 --19 (MariaDB服务器)
linux·运维·笔记·学习·云计算
Lynnxiaowen3 小时前
今天我们开始学习python3编程之python基础
linux·运维·python·学习