vue学习之内容渲染

内容渲染

  • 创建 demo2.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><!-- 1. 导入 vue 脚本文件 --><script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head><body><div id="app"><p>name: {{username}}</p><p>age: {{age}}</p><!-- v-html 命令: html 渲染 --><p v-html="desc"></p></div></body>
<script>const vm = {data: function() {return {username: 'zs',age: 18,desc: '<a href="https://cn.bing.com/">必应</a>'}}}const app = Vue.createApp(vm)app.mount('#app')
</script></html>

效果展示

  • 右键，在默认浏览器打开，效果如下
    在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/79407.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Vue自动生成二维码并可下载二维码

Vue自动生成二维码并可下载二维码

遇到一个需求&#xff0c;需要前端自行生成用户的个人名片分享二维码&#xff0c;并提供二维码下载功能。在网上找到很多解决方案&#xff0c;最终吭哧吭哧做完了&#xff0c;把它整理记录一下&#xff0c;方便后续学习使用&#xff01;嘿嘿O(∩_∩)O~ 这个小东西有以下功能特点…
阅读更多...
Linux基本认识

Linux基本认识

一、Linux基本概念 Linux 内核最初只是由芬兰人林纳斯托瓦兹&#xff08;Linus Torvalds&#xff09;在赫尔辛基大学上学时出于个人爱好而编写的。 Linux 是一套免费使用和自由传播的类 Unix 操作系统&#xff0c;是一个基于 POSIX 和 UNIX 的多用户、多任务、支持多线程和多…
阅读更多...
17:00面试，17:09就出来了 ，问的实在是太...

17:00面试，17:09就出来了 ，问的实在是太...

从外包出来&#xff0c;没想到算法死在另一家厂子 自从加入这家公司&#xff0c;每天都在加班&#xff0c;钱倒是给的不少&#xff0c;所以也就忍了。没想到8月一纸通知&#xff0c;所有人不许加班&#xff0c;薪资直降30%&#xff0c;顿时有吃不起饭的赶脚。 好在有个兄弟内…
阅读更多...
Qt ---进程间的通信

Qt ---进程间的通信

进程间通讯方式Qt 提供了四种进程间通信的方式&#xff1a; 使用共享内存&#xff08;shared memory&#xff09;交互&#xff1a;这是Qt 提供的一种各个平台均有支持的进程间交互的方式。TCP/IP&#xff1a;其基本思想就是将同一机器上面的两个进程一个当做服务器&#xff0c…
阅读更多...
API(九)基于协程的并发编程SDK

API(九)基于协程的并发编程SDK

一 基于协程的并发编程SDK 场景&#xff1a; 收到一个请求会并发发起多个请求,使用openresty提供的协程说明&#xff1a; 这个是高级课程,如果不理解可以先跳过遗留&#xff1a; APSIX和Kong深入理解openresty 标准lua的协程 ① 早期提供的轻量级协程SDK ngx.thread ngx…
阅读更多...
博客管理系统设计与实现

博客管理系统设计与实现

摘 要 随着Internet的广泛应用&#xff0c;动态网页技术也应运而生。本文介绍了应用ASP动态网页技术开发博客系统的设计与实现。 博客系统主要为用户提供发表文章、浏览文章等功能&#xff0c;用户通过Internet可以发表一些自己撰写的文章以和其他网友进行交流。博客系统主要实…
阅读更多...
前端JS中的异步编程与Promise

前端JS中的异步编程与Promise

&#x1f3ac; 岸边的风&#xff1a;个人主页 &#x1f525; 个人专栏 :《 VUE 》 《 javaScript 》 ⛺️ 生活的理想&#xff0c;就是为了理想的生活 ! 目录 一、JavaScript的异步编步机制 二、事件循环&#xff08;Event Loop&#xff09;和任务队列&#xff08;Task Queue…
阅读更多...
ROS学习笔记(五)---话题发布

ROS学习笔记(五)---话题发布

1. 话题通信是什么 在ROS&#xff08;机器人操作系统&#xff09;中&#xff0c;话题通信是一种常用的通信机制&#xff0c;用于在不同的ROS节点之间传递消息。话题通信基于发布者-订阅者模式&#xff0c;其中一个节点&#xff08;发布者&#xff09;发布消息到一个特定的话题…
阅读更多...
java学习三

java学习三

目录 Java 与 C 的区别 面向对象和面向过程的区别 面向对象特性 Java的基本数据类型 深拷贝和浅拷贝 Java创建对象的几种方式 final, finally, finalize 的区别 Java 与 C 的区别 Java 是纯粹的面向对象语言&#xff0c;所有的对象都继承自 java.lang.Object&#xff0c…
阅读更多...
评价模型：层次分析法

评价模型：层次分析法

1. 模型建立 1.1 建立层次结构模型 在深入分析实际问题的基础上&#xff0c;将有关的各个因素按照不同属性自上而下地分解成若干层次&#xff0c;同一层的诸因素从属于上一层的因素或对上层因素有影响&#xff0c;同时又支配下一层的因素或受到下层因素的作用。最上层为目标层…
阅读更多...
【多线程】死锁 详解

【多线程】死锁 详解

死锁 一. 死锁是什么二. 死锁的场景1. 一个线程一把锁2. 两个线程两把锁3. N 个线程 M 把锁 三. 死锁产生的四个必要条件四. 如何避免死锁 一. 死锁是什么 死锁是这样一种情形&#xff1a; 多个线程同时被阻塞&#xff0c;因为每个进程都在等其他线程释放某些资源&#xff0c;…
阅读更多...
Postman应用——初步了解postman

Postman应用——初步了解postman

Postman 是一个用于构建和使用 API 的 API 平台&#xff0c;Postman 简化了 API 生命周期的每个步骤并简化了协作&#xff0c;可以更快地创建更好的 API。 Postman 包含一个基于Node.js的强大的运行时&#xff0c;允许您向请求&#xff08;request&#xff09;和分组&#xff…
阅读更多...
UE4/UE5 动画控制

UE4/UE5 动画控制

工程下载​ ​​​​​​​​​​​​​https://mbd.pub/o/bread/ZJ2cm5pu 蓝图控制sequence播放/倒播动画&#xff1a; 设置开启鼠标指针&#xff0c;开启鼠标事件 在场景中进行过场动画制作 设置控制事件
阅读更多...
APP自动化之weditor工具

APP自动化之weditor工具

由于最近事情颇多&#xff0c;许久未更新文章。大家在做APP自动化测试过程中&#xff0c;可能使用的是Appium官方提供的inspect进行元素定位&#xff0c;但此工具调试不方便&#xff0c;于是今天给大家分享一款更好用的APP定位元素工具&#xff1a;weditor weditor基于web网页…
阅读更多...
C# Onnx Yolov8 Seg 分割

C# Onnx Yolov8 Seg 分割

效果 项目 代码 using Microsoft.ML.OnnxRuntime; using Microsoft.ML.OnnxRuntime.Tensors; using OpenCvSharp; using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System…
阅读更多...
合宙Air724UG LuatOS-Air LVGL API控件-开关 (Switch)

合宙Air724UG LuatOS-Air LVGL API控件-开关 (Switch)

开关 (Switch) 示例代码 function event_handler(obj, event)if event lvgl.EVENT_VALUE_CHANGED thenprint("State", lvgl.switch_get_state(obj))end endsw1 lvgl.switch_create(lvgl.scr_act(), nil) lvgl.obj_align(sw1, nil, lvgl.ALIGN_CENTER, 0, -50) lvg…
阅读更多...
Docker核心原理与实操

Docker核心原理与实操

第一章、Docker基本概念 1、概念&#xff1a;Docker是一种容器技术&#xff0c;可以解决软件跨环境迁移问题。 2、实现原理&#xff1a;是一个分层复用的文件系统&#xff1b;每一层都是一个独立的软件&#xff1b; …
阅读更多...
java:逆序排序的三种方法

java:逆序排序的三种方法

// 逆序第一种方法 public static void main(String[] args) {int arr[] {11, 22, 33, 44, 55, 66};for (int i arr.length-1; i > 0; i--) {System.out.print("\t"arr[i]);}}缺点&#xff1a;这个是直接逆转&#xff0c;如果里面是随机数没办法比较 逆序第二种…
阅读更多...
小技巧！Python生成excel文件的三种方式！

小技巧！Python生成excel文件的三种方式！

在我们做平常工作中都会遇到操作excel&#xff0c;那么今天写一篇&#xff0c;如何通过python操作excel。当然python操作excel的库有很多&#xff0c;比如pandas&#xff0c;xlwt/xlrd&#xff0c;openpyxl等&#xff0c;每个库都有不同的区别&#xff0c;具体的区别&#xff0…
阅读更多...
5.9.Webrtc线程事件处理

5.9.Webrtc线程事件处理

在前面的课程中呢&#xff0c;我已经向你介绍了事件处理的一些基础知识&#xff0c;那今天呢&#xff0c;我们再来看一下外边儿rtc下事件处理的基本逻辑是什么&#xff1f; 那首先呢&#xff0c;我们来看一下事件是如何协调线程工作的&#xff0c;那就如果这张图所展示的有两个…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023