Vue(Day01)——第一个Vue程序

直接引用的网址方式:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script src="https://unpkg.com/vue@3.4.20/dist/vue.global.js"></script><title>firstVue</title>
</head>
<body><div id="app"><h1>{{message}}</h1></div><script>const a=Vue.createApp({data(){return{message:"I like Vue"}}}).mount("#app");</script>
</body>
</html>

本地引用方式:把文件下载下来,放到项目文件里面(没有网络的时候也可以使用)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><script src="vue.js"></script><title>firstVue</title>
</head>
<body><div id="app"><h1>{{message}}</h1></div><script>const a=Vue.createApp({data(){return{message:"I like Vue"}}}).mount("#app");</script>
</body>
</html>

此时的vue.js文件和html文件是在同一个目录下的

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

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

相关文章

python opencv鼠标操作图片

目录 一:图片垂直移动 二:图片水平移动 三:图片缩放 鼠标操作函数: 你可以使用 cv2.setMouseCallback() 函数来为一个特定的窗口设置一个鼠标事件回调函数。这样,每当鼠标在该窗口上执行某种动作(如移动、点击、双击等)时,该回调函数就会被调用,并且会传递一些参数…

Canvas动画之豌豆射手

&#x1f339;作者主页&#xff1a;青花锁 &#x1f339;简介&#xff1a;Java领域优质创作者&#x1f3c6;、Java微服务架构公号作者&#x1f604; &#x1f339;简历模板、学习资料、面试题库、技术互助 &#x1f339;文末获取联系方式 &#x1f4dd; 往期热门专栏回顾 专栏…

linux 面试题

1.linux操作系统的常用指令可以详细说下吗,平常哪些用的比较多 文件目录操作命令: ls cd more cat tail mkdir touch rm rmdir 拷贝复制: cp mv 打包解包压缩解压: tar -z 解亚压缩 -c 打包 -x 解包 -v 显示过程 -f 指定文件名 文本编辑: vi vim 查找: find 查找文件 gre…

Fl Studio 20.9.2.2963 中文破解版2024永久版下载(含Keygen)

FL Studio20.9是一款流行的图像线软件制作和编辑音频文件。作为一款领先的创新产品&#xff0c;该软件能够满足在创作音乐方面的需求。有了这个产品&#xff0c;可以完成制作音乐的整个过程。可以使用这个软件进行写作&#xff0c;编辑&#xff0c;录音&#xff0c;编辑和混合和…

DP读书:《工程热力学(第二版)》(一)绪论——能量及其利用

DP读书&#xff1a;《工程热力学&#xff08;第二版&#xff09;》绪论 0.1 能量及其利用 热力学——研究对象&#xff1a;能量 能量 物质能量传递 普遍规律 能源&#xff1a;直接提供能量的物质资源 一次能源&#xff1a;热能占比85% 直接利用——>冶金、采暖、炊煮 …

第九届蓝桥杯省赛C++ / JAVA A组《航班时间》(c++)

1.题目说明 小 h 前往美国参加了蓝桥杯国际赛。 小 h 的女朋友发现小 h 上午十点出发&#xff0c;上午十二点到达美国&#xff0c;于是感叹到“现在飞机飞得真快&#xff0c;两小时就能到美国了”。 小 h 对超音速飞行感到十分恐惧。 仔细观察后发现飞机的起降时间都是当地…

Linux C 统计函数执行时间

Linux C 统计函数执行时间 代码实现 #include <stdio.h> #include <time.h>int main(void) {clock_t start, end;double cpu_time_used;start clock();/* function to be test here */end clock();cpu_time_used ((double) (end - start)) / CLOCKS_PER_SEC;p…

2024Node.js零基础教程(小白友好型),nodejs新手到高手,(九)NodeJS入门——http模块

060_http模块_网页URL之绝对路径 hello&#xff0c;大家好&#xff0c;这一个小题的话我们来补充一个之前学习过的内容&#xff0c;就是网页当中的URL&#xff0c;咱们这个小题的话主要是来说一下绝对路径&#xff0c;有同学可能会说&#xff0c;这这这&#xff0c;不对劲&…

抽象的后端

Connection refused: no further information 出现这条代码的核心是你使用redis&#xff0c;但是本地没有开启redis服务 如何启动redis服务 第一步&#xff1a;确定你安装了对应的框架 以spring为例 <dependency><groupId>org.springframework.boot</group…

架构设计实践:熟悉架构设计方法论,并动手绘制架构设计图

文章目录 一、架构设计要素1、架构设计目标2、架构设计模式&#xff08;1&#xff09;分而治之&#xff08;2&#xff09;迭代式设计 3、架构设计的输入&#xff08;1&#xff09;概览&#xff08;2&#xff09;功能需求 - WH分析法&#xff08;3&#xff09;质量 - “怎么”分…

代码随想录三刷day09

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、力扣242. 有效的字母异位词二、力扣349. 两个数组的交集三、力扣202. 快乐数 前言 当我们遇到了要快速判断一个元素是否出现集合里的时候&#xff0c;就要考…

数学的维度智慧

1.引入 在生活中&#xff0c;我们常常会提到一维&#xff0c;二维&#xff0c;三维&#xff0c;而按照常识&#xff0c;我们也知道一维指的是线&#xff0c;二维指的是面&#xff0c;三维指的是空间&#xff0c;而引申的四维&#xff0c;便是在空间的维度上添加了时间维度&…

卡玛网● 46. 携带研究材料 ● 01背包问题,你该了解这些! 滚动数组 力扣● 416. 分割等和子集

开始背包问题&#xff0c;掌握0-1背包和完全背包即可&#xff0c;注&#xff1a;0-1背包是完全背包的基础。 0-1背包问题&#xff1a;有n件物品和一个最多能背重量为w 的背包。第i件物品的重量是weight[i]&#xff0c;得到的价值是value[i] 。每件物品只能用一次&#xff0c;求…

Windows计划任务执行日志和文件输出路径修改

在日常工作中&#xff0c;针对需重复执行的操作&#xff0c;通常都会使用系统的任务计划程序功能&#xff1b; 1、大家可以运行中&#xff0c;执行taskschd.msc来调用任务计划程序对话窗口&#xff0c;也可以在服务器管理的-工具菜单中-选择任务计划程序来调用对话窗口。 2、…

投票项目_引入Echart 绘制饼状图

1. 后端接口返回查到的数据 GetMapping("/listResult/{id}")ApiOperation("显示投票结果接口")public R<List<Map<String, Object>>> listTaskVote(PathVariable String id) {log.info("传来的id:", id);List<Map<Strin…

FastBee商业版本源码获取下载

一、系统功能 系统功能功能说明开源版本商业版本产品管理产品详情、产品物模型、产品分类、设备授权、产品固件支持支持设备管理设备详情、设备分组、设备日志、设备分享、设备实时控制、实时状态、数据监测支持支持物模型管理属性&#xff08;设备状态和监测数据&#xff09;…

2024022502-数据库绪论

数据库绪论 数据管理的三个阶段 人工管理阶段 文件系统阶段 数据库系统阶段 基本术语 数据&#xff08;Data&#xff09; 计算机用来描述事物的记录&#xff08;文字&#xff0e;图形&#xff0e;图像&#xff0e;声音&#xff09;数据的形式本身并不能完全表达其内容&am…

宏景eHR DisplayFiles 任意文件读取漏洞复现

0x01 产品简介 宏景eHR人力资源管理软件是一款人力资源管理与数字化应用相融合,满足动态化、协同化、流程化、战略化需求的软件。 0x02 漏洞概述 宏景eHR DisplayFiles接口处存在任意文件读取漏洞,未经身份验证攻击者可通过该漏洞读取系统重要文件(如数据库配置文件、系统…

【PX4学习笔记】11.PX4飞行日志分析

目录 文章目录 目录日志分析的软件类型日志获取的方式官方网站PX4使用者官网推荐分析软件&#xff1a; 使用FIGHTPLOT软件分析日志FlightPlot软件的下载与安装使用flightplot软件进行简单的使用介绍log messagesFields List常用的数据姿态的四元数期望的姿态数据只看某一个数据…

ubuntu20.04准备离线安装包

ubuntu20.04 准备离线安装包 下载系统镜像[下载](https://mirror.tuna.tsinghua.edu.cn/ubuntu-releases/20.04.6/ubuntu-20.04.6-desktop-amd64.iso)安装ubuntu20.04配置网络(nano /etc/netplan/01-network-manager-all.yaml)下载离线安装包将/var/cache/apt/archives/目录下的…