Vue课程37-内容渲染指令
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <!-- 导入vue的库文件 --> <script src="./lib/vue-2.6.12.js"></script> <body> <!-- 希望vue能够控制下面的这个div 帮我们 --> <div id="app">{{username}} <p v-text="sex">性别</p> <p>性别:{{gender}}</p> <p>{{info}}</p> <!-- v-html指令的作用 可以把带有标签的字符串 渲染成真正的HTML内容 --> <p v-html="info"></p> </div> </body> </html> <script> //创建vue的实例对象 const vm=new Vue({ // el属性是固定写法 表示当前vm el:"#app", //数据类型 data:{ username: "geyao", sex:"男", info:'<h4 style="color:red;font-weight:bold;"></h4>' } }) </script>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 25岁的心里话
· 闲置电脑爆改个人服务器（超详细） #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目（很简单哒）
· 零经验选手，Compose 一天开发一款小游戏！
· 一起来玩mcp_server_sqlite，让AI帮你做增删改查！！