vue快速入门(一)vue的导入方法

注释很详细,直接上代码

新增内容

  1. 下载js代码
  2. 导入实例
  3. 数据绑定显示

源码

index.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>
</head>
<body>
  <!-- 挂载点 -->
  <div id="root">{{ message }}</div>

  <!-- 导入vue的js代码 -->
  <script src="./lib/vue2.js"></script>

  <script>
    const app = new Vue({// Vue实例
      el: '#root',// 挂载点
      data: {// 数据
        message: 'Hello Vue!'
      }
    })
  </script>
</body>
</html>

有人问了,你这个vue2.js哪来的

点击跳转

右击另存为,放入合适的路径下

在这里插入图片描述

效果演示

在这里插入图片描述

下一篇

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

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

相关文章

《C++程序设计》阅读笔记【2-程序结构】

&#x1f308;个人主页&#xff1a;godspeed_lucip &#x1f525; 系列专栏&#xff1a;《C程序设计》阅读笔记 本文对应的PDF源文件请关注微信公众号程序员刘同学&#xff0c;回复C程序设计获取下载链接。 1 程序结构1.1 外部存储类型1.2 静态存储类型1.2.1 静态全局变量1.2.…

设计模式之外观(门面)模式

概念&#xff1a;要求一个子系统的外部与其内部的通信必须通过一个统一的对象进行。外观模式提供一个高层次的接口&#xff0c;使得子系统更易使用。 外观模式注重“统一的对象”&#xff0c;即提供一个访问子系统的接口&#xff0c;只有通过该接口&#xff08;Facade&#xf…

TCP的十个重要的机制

注&#xff1a;TCP不是只有十个机制 TCP 可靠传输是tcp最为重要的核心&#xff08;初心&#xff09; 可靠传输&#xff0c;并不是发送方把数据能够100%的传输给接收方 而是退而求其次 让发送方发送出去数据之后&#xff0c;能够知道接收方是否收到数据。 一但发现对方没有…

IPSec VPN 高级应用

IPSec的隧道嵌套 公网上架设多层隧道&#xff0c;整合不同隧道的优点&#xff0c;弥补缺点 1、GRE over IPSec VPN 1&#xff09;特点 通过GRE隧道运行的路由协议、组播等功能 通过IPSec提供数据的机密性、完整性检查、源认证 IPSec是保护GRE上面的所有流量&#xff08;动…

MIT6.828实验windows10下环境配置

根据6.1810提供的方法安装环境 实验地址 微软文档 一、安装 Windows Terminal https://apps.microsoft.com/store/detail/windows-terminal/9N0DX20HK701 二、安装WSL2 参考源&#xff1a;tommickey的博客园 启动Windows 子系统 1、 手动开启 打开「控制面板」&#xff…

可以写网易云的了!

你好&#xff0c;我是云桃桃。 一个希望帮助更多朋友快速入门 WEB 前端的程序媛。 1枚程序媛&#xff0c;大专生&#xff0c;2年时间从1800到月入过万&#xff0c;工作5年买房。 分享成长心得。 259篇原创内容-gzh 后台回复“前端工具”可获取开发工具&#xff0c;持续更新中…

2024-HW --->SSRF

这不是马上准备就要护网了嘛&#xff0c;如火如荼的报名ing&#xff01;&#xff01;&#xff01;那么小编就来查缺补漏一下以前的web漏洞&#xff0c;也顺便去收录一波poc&#xff01;&#xff01;&#xff01;&#xff01; 今天讲的主人公呢就是SSRF&#xff0c;以前学的时候…

【leetcode C++】滑动窗口

1. LCR 008. 长度最小的子数组 题目 给定一个含有 n 个正整数的数组和一个正整数 target 。 找出该数组中满足其和 ≥ target 的长度最小的 连续子数组 [numsl, numsl1, ..., numsr-1, numsr] &#xff0c;并返回其长度。如果不存在符合条件的子数组&#xff0c;返回 0 。 题目…

如何自动申请免费的HTTPS证书?

在购买域名的时候我相信很多人都遇到了对于证书的问题&#xff0c;之前我也是使用阿里云的免费一年的证书&#xff0c;那时候感觉还好&#xff0c;一年更换一次&#xff0c;但是近期阿里云对于证书的过期时间直接砍到了三个月&#xff01;让我难以接受&#xff0c;所以我在想吧…

WPF中动画教程(DoubleAnimation的基本使用)

实现效果 今天以一个交互式小球的例子跟大家分享一下wpf动画中DoubleAnimation的基本使用。该小球会移动到我们鼠标左键或右键点击的地方。 该示例的实现效果如下所示&#xff1a; 页面设计 xaml如下所示&#xff1a; <Window x:Class"AnimationDemo.MainWindow&qu…

Harbor私有镜像仓库搭建

一、介绍 Docker容器应用的开发和运行路不开可靠的镜像管理&#xff0c;虽然Docker官方也提供了公共的镜像仓库&#xff0c;但是从安全和效率等方面考虑&#xff0c;部署我们私有环境的Registry也是非常必要的。 Harbor是由VMware公司开源的企业级的Docker Registry管理项目&a…

面试算法-139-盛最多水的容器

题目 给定一个长度为 n 的整数数组 height 。有 n 条垂线&#xff0c;第 i 条线的两个端点是 (i, 0) 和 (i, height[i]) 。 找出其中的两条线&#xff0c;使得它们与 x 轴共同构成的容器可以容纳最多的水。 返回容器可以储存的最大水量。 说明&#xff1a;你不能倾斜容器。…

STM32单片机智能电表交流电压电流程序设计(电流 电压互感器TV1005M+TA1005M)

资料下载地址&#xff1a;STM32单片机智能电表交流电压电流程序设计(电流 电压互感器TV1005MTA1005M) 1、摘要 5、基于STM32F103单片机智能电表交流电压电流设计 本设计由STM32单片机核心板电路交流电压电流检测模块电路WIFI模块电路指示灯电路组成。 1、通过电压互感器TV100…

C++模板实参推断

模板实参推断 我们已经看到&#xff0c;对于函数模板&#xff0c;编译器利用调用中的函数实参来确定其模板参数。 从函数实参来确定模板实参的过程被称为模板实参推断。 也就是说&#xff0c;只有函数参数才配有模板实参推断&#xff0c;函数返回类型是不配有的 在模板实参…

DNS搭建

DNS搭建 一、DNS简介 1、概念 DNS&#xff08;Domain Name System&#xff09;是一种分布式的命名系统&#xff0c;用于将域名与其对应的IP地址相互映射。简单来说&#xff0c;DNS充当了互联网上的“电话簿”&#xff0c;帮助用户通过易于记忆的域名查找到相应的网络资源&am…

调用飞书获取用户Id接口成功,但是没有返回相应数据

原因&#xff1a; 该自建应用没有开放相应的数据权限。 解决办法&#xff1a; 在此处配置即可。

Python打包exe文件——pyinstaller模块

Python打包exe文件——pyinstaller模块 目录 Python打包exe文件——pyinstaller模块介绍安装打包文件夹模式打包单文件模式方式SPEC打包(推荐) 介绍 当要在没有python环境的设备上运行python文件时就可以将环境变量全部封装成exe文件发送给对方&#xff0c;此时就可以使用打包…

使用Python实现基本的线性回归模型

线性回归是一种简单而强大的统计学方法&#xff0c;用于预测一个因变量与一个或多个自变量之间的关系。在本文中&#xff0c;我们将使用Python来实现一个基本的线性回归模型&#xff0c;并介绍其原理和实现过程。加粗样式 什么是线性回归&#xff1f; 线性回归是一种用于建立…

upload-labs训练平台

GitHub&#xff1a;GitHub - Tj1ngwe1/upload-labs: 一个帮你总结所有类型的上传漏洞的靶场 把下好的文件夹之间拖入到小皮的WWW目录下就可以之间访问网址使用了 目录 Pass-01(前端JS的绕过) (1)抓包绕过 (2)在前端绕过 Pass-02&#xff08;content-type绕过&#xff09;…

kettle快速入门教程

探索数据的深邃奥秘&#xff0c;引领你踏入数据处理的殿堂&#xff01;Kettle&#xff08;Pentaho Data Integration&#xff09;的神奇魔力&#xff0c;将为你解锁数据世界的无限可能。本人基于公司业务实战整理的50篇精华Kettle系列文章&#xff0c;是你的密钥&#xff0c;让…