引入Vue的方式

1.cdn引入

<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>
<body>
 
  <h2>哈哈哈</h2>
  <p>我是内容, 呵呵呵呵</p>
 
  <div id="app"></div>
   
  <!-- CDN地址 -->
  <script src="https://unpkg.com/vue@next"></script>
  <script>
    // 使用Vue
    const app = Vue.createApp({
      template: `<h2>Hello World</h2><span>呵呵呵</span>`
    })
    // 挂载
    app.mount("#app")
 
  </script>
</body>
</html>

 2.本地下载vue.js引入

<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>
<body>
 
  <div id="app"></div>
   
  <script src="./lib/vue.js"></script>
  <script>
     
    // 1.创建app
    const app = Vue.createApp({
      template: `<h1>Hello Vue</h1>`
    })
 
    // 2.挂载app
    app.mount("#app")
 
  </script>
 
</body>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

配置需求分类中的科目分配

其中科目分配的内容都为灰色无法修改 结果是在科目分配里面单独维护的&#xff1a; 路径&#xff1a;销售分销-基本功能-科目分配/成本-维护成本科目分配的需求类别

【Ceph集群应用】Ceph对象存储系统之RGW接口详解

Ceph对象存储系统之RGW接口详解 1.创建Ceph对象存储系统RGW接口2. 开启httphttps,更改监听端口3. 更改监听端口4.S3接口访问测试5.实验中遇到的故障案例 接上文基于ceph-deploy部署Ceph集群详解 1.创建Ceph对象存储系统RGW接口 &#xff08;1&#xff09;对象存储概念 对象存…

广州市番禺区委领导一行莅临和鲸科技考察交流

7月18日下午&#xff0c;广州市番禺区区委常委、组织部部长、人才工作局局长唐力明&#xff0c;组织部副部长、两新工委书记罗翌洁及组织部其他相关领导一行莅临和鲸科技开展实地考察与调研&#xff0c;国投科创广州基地负责人、海创人才南方创业服务中心常务副秘书长徐斌&…

详解C#开发Android应用程序的流程

Android系统一下子铺天盖地而来&#xff0c;让人目不暇接。兴奋的同时也让部分开发人员犯难了&#xff01;要知道从熟知的Wince、Mobile开发语言C#跨越到RFID-Android的Java。可不是一朝一夕就能完成的。就好比你的乾坤大挪移已经第七层了&#xff0c;却忽然要你从易筋经从头练…

Beyond Compare 代码比较工具

一、下载 官网下载地址&#xff1a; https://www.scootersoftware.com/download.php 选择 Windows 系统&#xff0c;简体中文版本&#xff0c;点击下载。 下载完成 二、安装 步骤1&#xff1a;双击安装包 步骤2&#xff1a;进入安装向导&#xff0c;点击下一步 步骤3&a…

微信小程序事件点击跳转页面的五种方法

第一种:标签 这是最常见的一种跳转方式,相当于html里的a标签 <navigator url"/pages/main/main"></navigator>第二种:wx.navigateTo({})方法 1.前端wxml <button bindtap"getCeshi" type"primary"> 测试按钮 </button>…

php连接上mysql数据库该的配置方法

用mysql官方的管理工具workbench&#xff1a; 打开导出界面后&#xff0c;下一步&#xff0c;选择csv格式&#xff0c;导出后excel就能打开了 如果你需要在程序代码中导出&#xff0c;需要找到对应代码的excel处理库。 如php 的 phpExcel( 最新版已更名为 phpoffice/phpspread…

思维决定发展,测试人也不例外

最近特别懒&#xff0c;不想码字&#xff0c;原本写作就很差&#xff0c;更是退化严重。社招和校招面试过很多人&#xff0c;从十年前自己还很弱的时候学着面试&#xff0c;到数百次面试积累之后&#xff0c;面对候选人的时候&#xff0c;我的内心依然有些许紧张&#xff0c;非…

域内信息收集

将网络中多台计算机逻辑上组织到一起进行集中管理&#xff0c;这种区别于工作组的逻辑环境叫 做域。域是由域控制器(Domain Controller)和成员计算机组成&#xff0c;域控制器就是安装了活动 目录(Active Directory)的计算机。活动目录提供了存储网络上对象信息并使用网络使用该…

132、仿真-基于51单片机主从串口通信家用防盗报警器设计(程序+Proteus仿真+流程图等)

毕设帮助、开题指导、技术解答(有偿)见文未 目录 一、设计功能 二、Proteus仿真图​编辑 三、程序源码 资料包括&#xff1a; 需要完整的资料可以点击下面的名片加下我&#xff0c;找我要资源压缩包的百度网盘下载地址及提取码。 方案选择 单片机的选择 方案一&#xff1…

C++模拟实现位图和布隆过滤器(哈希)

目录 前言引入&#xff1a; 一、位图 1.1 位图概念 1.2 位图的实现 1.3 位图的应用 二、布隆过滤器 2.1 哈希的弊端 2.2 布隆过滤器概念 2.3 布隆过滤器的插入 2.4 布隆过滤器的查找 2.5 布隆过滤器的删除 2.6 布隆过滤器的模拟实现 2.7 布隆过滤器优缺点 三、…

那些漏洞挖掘高手都是怎么挖漏洞的?

前言 说到安全就不能不说漏洞&#xff0c;而说到漏洞就不可避免地会说到三座大山&#xff1a; 漏洞分析 漏洞利用 漏洞挖掘 从个人的感觉上来看&#xff0c;这三者尽管通常水乳交融、相互依赖&#xff0c;但难度是不尽相同的。本文就这三者分别谈谈自己的经验和想法。 漏洞分析…

Spring、SpringBoot、SpringCloud、SpringCloud Alibaba、Elasticsearch版本对应,附下载地址

1、GitHub Alibaba 发布SpringCloud Alibaba和SpringCloud 、SpringBoot版本 Spring Cloud Alibaba VersionSpring Cloud VersionSpring Boot2022.0.0.0-RC2Spring Cloud 2022.0.03.02022.0.0.0-RC1Spring Cloud 2022.0.03.0.02021.0.5.0*Spring Cloud 2021.0.52.6.132021.0.4…

中国人民大学与加拿大女王大学金融硕士--中外合作办学硕士领域的宝藏项目

大多数读研人都知道&#xff0c;从办学方式来看&#xff0c;中外合作办学硕士可以分为两种&#xff1a; 一是双学位教育项目&#xff0c;颁发的是外方高校硕士学位证书&#xff0c;同时还可以申请国内高校的硕士学位证书&#xff0c;同时教育部中留服还可以做学历学位认证。 二…

MyBatis学习笔记——1

MyBatis学习笔记——1 一、MyBatis概述1.1、框架1.2、三层架构1.4、了解MyBatis1.4、ORM思想 二、MyBatis入门程序2.1、Mybatis程序的编写2.2、MyBatis入门程序的一些小细节2.3、MyBatis事务管理机制深度解析2.4、在开发中junit是如何使用的2.5、Mybatis集成日志框架logback 三…

【UE4 塔防游戏系列】08-敌人到达终点对玩家造成伤害

目录 效果 步骤 一、敌人到终点时扣除玩家生命值 二、显示玩家生命值 效果 可以看到敌人进入终点后&#xff0c;左上角的玩家生命值会减少。 步骤 一、敌人到终点时扣除玩家生命值 新建一个Actor蓝图类&#xff0c;命名为“BP_EnemyEndPlace”&#xff0c;用来表示终点…

python实现拼多多商品详情接口API

最近工作需要用到拼多多的一些接口&#xff0c;官方竟然没有提供&#xff0c;python的sdk&#xff0c;于是就自己简单的写了一个商品SKU接口的api。 1、代码 #!/usr/bin/python3# -*- coding: utf-8 -*-# Time : 2020/3/29 0021 下午 19:40# Author : xiaozhi&#xff01;…

Flutter:EasyLoading(loading加载、消息提示)

前言 官方虽然提供了内置的加载指示器和提示信息&#xff0c;但是功能比较简陋&#xff0c;这里推荐&#xff1a;flutter_easyloading CircularProgressIndicator CircularProgressIndicator()加粗样式 ScaffoldMessenger.of(context).showSnackBar(const SnackBar(// 提示…

浅谈无人机遥感图像拼接与处理方法

遥感&#xff08;RS-Remote Sensing&#xff09;——不接触物体本身&#xff0c;用传感器收集目标物的电磁波信息&#xff0c;经处理、分析后&#xff0c;识别目标物&#xff0c;揭示其几何、物理性质和相互关系及其变化规律的现代科学技术。 换言之&#xff0c;即是“遥远的感…

第六章内存保护单元(Cortex-M7 Processor)

目录 第六章内存保护单元 6.1关于MPU 6.2MPU功能描述 6.3MPU编程器模型 第六章内存保护单元 介绍MPU (Memory Protection Unit)。它包含以下部分: 关于第6-2页的MPU。MPU功能描述见第6-3页。MPU程序员模型在第6-4页。 6.1关于MPU MPU是内存保护的可选组件。处理器支持标准…