【Web - 框架 - Vue】随笔 - 通过`CDN`的方式使用`VUE 2.0`和`Element UI`
通过CDN的方式使用VUE 2.0和Element UI
VUE
网址
https://cdn.bootcdn.net/ajax/libs/vue/2.7.16/vue.js
源码
https://download.csdn.net/download/HIGK_365/88815507
测试
代码
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div><h1>{{info}}</h1>
</div>
<script src="vue.js"></script>
<script>let v = new Vue({el:"div",data:{info:"Hello Vue!"}})
</script>
</body>
</html>
结果
Element UI
网址
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
源码
https://download.csdn.net/download/HIGK_365/88815554
测试
代码
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><!-- import CSS --><link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app"><el-button @click="visible = true">Button</el-button><el-dialog :visible.sync="visible" title="Hello world"><p>Try Element</p></el-dialog>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.7.16/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>new Vue({el: '#app',data: function () {return {visible: false}}})
</script>
</html>
结果
相关文章：
【Web - 框架 - Vue】随笔 - 通过`CDN`的方式使用`VUE 2.0`和`Element UI`
通过CDN的方式使用VUE 2.0和Element UI VUE 网址 https://cdn.bootcdn.net/ajax/libs/vue/2.7.16/vue.js源码 https://download.csdn.net/download/HIGK_365/88815507测试 代码 <!DOCTYPE html> <html lang"en"> <head><meta charset&quo…...
设计模式（行为型模式）备忘录模式
目录 一、简介二、备忘录模式2.1、备忘录2.2、原发器2.3、备忘录模式 三、优点与缺点 一、简介 备忘录模式（Memento Pattern）是一种行为设计模式，旨在捕获一个对象的内部状态，并在不破坏对象封装的前提下将其保存，以便…...
opencv案例实战：条码区域分割
前言 识别二维码是一个日常生活中常见的应用，而识别之前，需要先分割出条形码的区域来获取条形码。我们可以使用OpenCV便捷的获取条码的区域。 逐步分析 为了了解数据处理的过程，我们逐步分析并显示处理过程 查看图像 在读入时，传入参数cv2.IMREAD_GRAYSCALE可以直接按…...
《MySQL》超详细笔记
目录 基本知识 主流数据库 数据库基本概念 MySQL启动 数据库基本命令 数据库 启动数据库 显示数据库 创建数据库 删除数据库 使用数据库 查询当前数据库信息 显示数据库中的表 导入数据库脚本 表 查看表的结构 查看创建某个表的SQL语句 数据库的查询命令 查询…...
商用密码
商用密码（Commercial Cryptography）涉及到多个方面，包括但不限于数据加密、数字签名、身份验证和安全通信等。商用密码的目的是保护信息的机密性、完整性和可用性，确保数据在存储和传输过程中的安全。以下是一些Java商用密码方向的…...
css1文本属性
一.颜色（color）（一般用16进制） 二.对齐（text-align) 三.装饰（text-decoration） 四.缩进（text-indent）（一般用2em）（有单位）…...
在容器中使用buildah构建镜像
简介 buildah是一个构建OCI标准镜像的工具，可以用来替代docker build 在常见的linux发行版中可直接通过包管理工具安装使用 # centos yum install buildah# ubuntu/debian apt install buildah# alpine apk add buildah其他发行版安装方法详见 github，…...
GPT4_VS_ChatGPT（from_nytimes）
GPT4 VS ChatGPT（from nytimes ） 正如文章官网博文：https://openai.com/research/gpt-4所述，GPT4仍有很多不足之处，还不及人类水平。纽约时报报道了一些人体验GPT4的效果和一些评价： Cade Metz 要求专家使…...
中兴R5300G4服务器查看服务器、主板序列号及硬盘RAID信息
本文在操作系统带内通过指令操作查看中兴R5300G4服务器、主板序列号及硬盘RAID信息。 一、中兴R5300G4服务器查看服务器、主板序列号 在Linux服务器上，可以使用dmidecode命令来查看服务器的硬件相关信息，由于该命令要读取系统的硬件信息，因…...
部署tomcat
1 idea打包完，找到target目录下的网站 我的叫做 test.webSYS 2 linux 安装 tomcat 后 修改conf下的server.xml中的Connector的port <Connector port"9001" protocol"HTTP/1.1"connectionTimeout"20000"redirectPort"8443…...
【Java 数据结构】枚举
枚举的使用 1 背景及定义2 使用3 枚举优点缺点4 枚举和反射4.1 枚举是否可以通过反射，拿到实例对象呢？ 5 总结面试问题(单例模式学完后可以回顾)： 1 背景及定义 public static final int RED 1; public static final int GREEN 2; public …...
Python（20）正则表达式(Regular Expression)中常用函数用法
大家好！我是码银🥰 欢迎关注🥰： CSDN：码银 公众号：码银学编程 正文 正则表达式 粗略的定义：正则表达式是一个特殊的字符序列，帮助用户非常便捷的检查一个字符串是否符合某种模…...
docker 离线安装镜像
一、导出镜像 下载完镜像后，我们需要将其导出为tar文件，以便在离线环境中使用。 执行以下命令导出镜像： docker save -o <保存路径>/<镜像名>_<版本>.tar <镜像名>:<版本>其中，<保存路径>是…...
由vscode自动升级导致的“终端可以ssh服务器，但是vscode无法连接服务器”
问题描述 简单来说就是，ssh配置没动，前两天还可以用vscode连接服务器，今天突然就连不上了，但是用本地终端ssh可以顺利连接。 连接情况 我的ssh配置如下： Host gpu3HostName aaaUser zwx现在直接在终端中进行ssh&am…...
typecho 在文章中添加 bilibili 视频
一、获取视频来源： 可以有2种方式来定位一个 bilibili 视频： 第一种是使用 bvid 参数定位第二种是使用 aid 参数定位 如何获取这两个参数？ 首先我们可以看看 bilibili 网站中的视频页面链接其实可以分为两种： 第一种是类似&a…...
Android.mk 语法详解
一.Android.mk简介 Android.mk 是Android 提供的一种makefile 文件,注意用来编译生成（exe，so，a，jar，apk）等文件。 二.Android.mk编写 分析一个最简单的Android.mk LOCAL_PATH : $(call my-dir) //定义了…...
ChatGPT高效提问—prompt基础
ChatGPT高效提问—prompt基础 设计一个好的prompt对于获取理想的生成结果至关重要。通过选择合适的关键词、提供明确的上下文、设置特定的约束条件，可以引导模型生成符合预期的回复。例如，在对话中，可以使用明确的问题或陈述引导模型生成…...
和副本(Replicas)的使用)
Elasticsearch 中的索引的分区(Shards)和副本(Replicas)的使用
Elasticsearch是一个高性能的、分布式的搜索与数据分析引擎，广泛用于全文搜索、结构化搜索、分析以及这三者的组合场景。在Elasticsearch中，“索引”（Index）是其最基本的数据管理单位，可以类比为传统关系数据库中的“数…...
智慧工地反光衣识别检测系统-自动识别是否穿着制定工作服---豌豆云
智慧工地反光衣识别检测特定地区工作人员不穿反光服装个人行为预警，一旦检测到某些不穿反光服装施工作业人员智慧工地反光衣识别检测马上开启警报。 真真正正做到事前预警、事中检测、过后管理。安全操作规程工作人员从繁杂无趣的盯显示屏的每日任务中抽身出去。 …...
vue绘制语音波形图---wavesurfer.js
文章目录 创建实例optionsmethod接收Blob流 https://wavesurfer.xyz/ 创建实例 引入插件：import WaveSurfer from "wavesurfer.js"创建实例对象：this.wavesurfer WaveSurfer.create(options); <div id"waveform"><!-- t…...
从零到一：深度解析BertTokenizer.from_pretrained的加载机制与实战技巧
1. 初识BertTokenizer.from_pretrained：你的NLP敲门砖 第一次接触Hugging Face的Transformers库时，我被BertTokenizer.from_pretrained()这个方法深深吸引了。它就像是一把万能钥匙，能快速打开各种预训练语言模型的大门。记得当时我尝试用传统…...
手把手教你用ENA-TDR实测USB3.0线：阻抗、延时、串扰一个不漏
深度解析USB3.0线缆全参数测试：从TDR原理到实战报告解读 在高速数据传输领域，一根优质USB3.0线缆的价值往往被严重低估。当工程师们为系统稳定性问题焦头烂额时，很少有人会想到问题可能出在那根不起眼的连接线上。事实上，根据行业…...
Qwen3-TTS作品分享：听AI朗读你的日记、诗歌和故事
Qwen3-TTS作品分享：听AI朗读你的日记、诗歌和故事 1. 为什么你需要一个会"读心"的语音合成工具 想象一下这样的场景：深夜写完日记，点击播放键，听到一个温暖的声音将你的文字娓娓道来；创作完一首诗…...
3步告别桌面混乱：开源免费的NoFences桌面分区管理工具
3步告别桌面混乱：开源免费的NoFences桌面分区管理工具 【免费下载链接】NoFences 🚧 Open Source Stardock Fences alternative 项目地址: https://gitcode.com/gh_mirrors/no/NoFences 你是否每天都要在杂乱无章的桌面图标中浪费宝贵时间&#x…...
BG3ModManager模组管理工具完全指南
BG3ModManager模组管理工具完全指南 【免费下载链接】BG3ModManager A mod manager for Baldurs Gate 3. 项目地址: https://gitcode.com/gh_mirrors/bg/BG3ModManager 一、初识BG3ModManager BG3ModManager作为《博德之门3》的专用模组管理工具，为玩家提供…...
如何高效解决网页视频下载难题：VideoDownloadHelper智能解析工具全解析
如何高效解决网页视频下载难题：VideoDownloadHelper智能解析工具全解析 【免费下载链接】VideoDownloadHelper Chrome Extension to Help Download Video for Some Video Sites. 项目地址: https://gitcode.com/gh_mirrors/vi/VideoDownloadHelper 在数字化内…...
从零搭建无人船：两年实战后，我总结的ArduPilot+Pixhawk避坑全流程
从零搭建无人船：两年实战后，我总结的ArduPilotPixhawk避坑全流程 第一次把无人船放进水里时，GPS信号突然丢失，船体在河中央失控打转——这个惊心动魄的瞬间让我意识到，开源飞控的实战应用远不是下载代码、连接硬件那么…...
教无人机操控3年，这款仿真软件让我彻底告别“真机实训焦虑”
作为无人机专业实操教师，深耕一线教学3年，最大的痛点莫过于“真机实训难”——相信同行们都有共鸣，无人机操控教学看似是“练手”，实则处处是坑，每一个难题都让人头疼不已，甚至一度让我陷入教学焦虑。整理了…...
忍者像素绘卷参数详解：如何通过提示词触发‘火之意志’专属风格权重
忍者像素绘卷参数详解：如何通过提示词触发火之意志专属风格权重 1. 认识忍者像素绘卷 忍者像素绘卷是一款基于Z-Image-Turbo深度优化的图像生成工具，它将传统忍者文化与16-Bit复古游戏美学完美结合。这款工具特别适合创作具有热血动漫风格的像素艺术作…...
3个创新方法：用Krita AI Diffusion插件实现智能动画制作
3个创新方法：用Krita AI Diffusion插件实现智能动画制作 【免费下载链接】krita-ai-diffusion Streamlined interface for generating images with AI in Krita. Inpaint and outpaint with optional text prompt, no tweaking required. 项目地址: https://gitco…...