创建第一个Vue2项目-----HelloWorld

创建第一个Vue项目

  1. 第一步先去安装Vue,一共有两种安装方式,这里使用

点击这里下载:Vue.js
在这里插入图片描述
添加到自己的项目中
在这里插入图片描述
在使用的页面引入<script src="../js/vue.js"></script>
2. 准备好一个容器

<div id="root"><h1>hello{{name}}</h1>
</div>
  1. 创建一个Vue实例
<script>Vue.config.productionTip = false //阻止 vue 在启动时生成产生提示。// 创建Vue实例new Vue({el:'#root', //el用于指定当前Vue实例为那个容器服务,值通常为css选择器字符串。data:{//data用于存储数据,数据供el指定的容器使用,暂时写成一个对象name:'World'}})
</script>
  1. 运行时浏览器还需安装vue的开发者工具
    链接:https://pan.baidu.com/s/1JzHx27vZ5_c8F9gHA5gzgg?pwd=0622
    提取码:0622
  2. 打开浏览器的设置中的拓展程序,打开开发者模式直接将文件拖入浏览器中下载即可
    在这里插入图片描述

最后回到vscode中运行html页面,运行没问题且看到Vue后就代表安装成功了

在这里插入图片描述

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

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

相关文章

阿里云大数据工程师ACP认证,今天终于搞定了,87分

为啥我得去考个阿里云大数据工程ACP证书&#xff1f; 首先得声明&#xff0c;这不是因为我对阿里有多痴迷&#xff0c;也不是因为我想把我的简历装饰得花里胡哨。实际上&#xff0c;这更像是一场自我挑战的游戏。我就是一根筋&#xff0c;当时公司要求考阿里云大数据工程师认证…

Redis部署-集群

目录 集群 数据分片算法 哈希求余 一致性哈希算法 哈希槽分区算法 redis集群搭建 1.创建目录和配置. 2.将上述redis节点.构建成集群 3.使用客户端连接集群 集群模式下的故障转移流程 1.故障判定 2.故障迁移 集群扩容 集群 广义上的集群,只要是多个机器,构成了分布…

[IDEA] 写代码时没有类型推断的解决方法

本示例使用scala, 其他语言同理 使用 .var 时会自动生成变量 使用快捷键 CtrlAtlv 一样 val abc "abc"但是这个变量没有显式表现类型 期望 val abc: String "abc" 解决方法

【带头学C++】----- 九、类和对象 ---- 9.13 运算符重载——(9.13.1-9.13.4)

❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️创做不易&#xff0c;麻烦点个关注❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️ ❤️❤️❤️❤️❤️❤️❤️❤️❤️文末有惊喜&#xff01;献舞一支&#xff01;❤️❤️❤️❤️❤️❤️❤️❤️❤️❤️ 目录 9.13…

Linux安装MySQL数据库系统

1、MySQL的编译安装。 1.1、准备工作 &#xff08;1&#xff09;为了避免发生端口冲突、程序冲突等现象&#xff0c;建议先查询MySQL软件的安装情况&#xff0c;确认没有使用以RPM方式安装的mysql-server、mysql软件包&#xff0c;否则建议将其卸载。 [rootlocalhost ~]# rp…

微信社群机器人开发

简要描述&#xff1a; 删除朋友圈 请求URL&#xff1a; http://域名地址/deleteSns 请求方式&#xff1a; POST 请求头Headers&#xff1a; Content-Type&#xff1a;application/jsonAuthorization&#xff1a;login接口返回 参数&#xff1a; 参数名必选类型说明wId…

蚂蚁集团20篇论文入选AI顶会NeurlPS,7成论文聚焦生成式AI

人工智能新浪潮如火如荼&#xff0c;中国互联网企业奋力逐浪并行。 当地时间12月10日&#xff0c;为期六天的全球AI顶级会议NeurlPS在美国路易斯安那州新奥尔良市举办。NeurlPS披露的数据显示&#xff0c;本届会议共有12343篇有效论文投稿&#xff0c;接收率仅为26.1%。蚂蚁集…

FastAPI之响应模型

前言 响应模型我认为最主要的作用就是在自动化文档的显示时&#xff0c;可以直接给查看文档的小伙伴显示返回的数据格式。对于后端开发的伙伴来说&#xff0c;其编码的实际意义不大&#xff0c;但是为了可以不用再额外的提供文档&#xff0c;我们只需要添加一个 response_mod…

单片双向马达驱动芯片D6208的芯片描述

D6208 是一块单片双向马达驱动电路&#xff0c;它使用TTL电平的逻辑信号就能控制卡式录音机和其它电子设备中的双向马达。该电路由一个逻辑部分和一个功率输出部分组成。逻辑部分控制马达正、反转向及制动&#xff0c;功率输出部分根据逻辑控制能提供100mA&#xff08;典型值&a…

[PyTorch][chapter 6][李宏毅深度学习][Logistic Regression]

前言&#xff1a; logistic回归又称logistic回归分析&#xff0c;是一种广义的线性回归分析模型&#xff0c;常用于数据挖掘&#xff0c;疾病自动诊断&#xff0c;经济预测等领域。 逻辑回归根据给定的自变量数据集来估计事件的发生概率&#xff0c;由于结果是一个概率&#xf…

【docker 】 安装docker(centOS7)

官网 docker官网 github源码 官网 在CentOS上安装Docker引擎 官网 在Debian上安装Docker引擎 官网 在 Fedora上安装Docker引擎 官网 在ubuntu上安装Docker引擎 官网 在RHEL (s390x)上安装Docker引擎 官网 在SLES上安装Docker引擎 最完善的资料都在官网。 卸载旧版本 …

异地现场工控设备,如何实现远程配置、调试?

南京某企业专注于工业物联领域&#xff0c;在相关项目中往往会在各个点位部署基于Linux系统的中控主机&#xff0c;实现各类物联设备信息的采集、汇总。但是&#xff0c;由于各点位分散多地&#xff0c;且数量达到了上百个&#xff0c;虽然中控主机具备4G物联网接入能力&#x…

Vue3-07-样式绑定-style绑定的写法总结

style 绑定的方式 1.html中直接一个属性一个属性的写&#xff1b; 2.直接绑定一个对象&#xff1b; 3.绑定一个包含多个样式对象的数组。style绑定样式的注意点 推荐使用 驼峰命名 规则来编写样式的名称&#xff0c;如 &#xff1a; fontSize:12px; 如果使用 中线分割的规则时…

医美行业-上游厂商的营销规模分析与测算

一、医美行业整体发展趋势&#xff1a;轻医美逐步占领市场&#xff0c;占比逐年增加&#xff0c;规模增速远超手术类医美 从2019年开始医美行业扩张速度放缓&#xff0c;2020年受疫情影响中国美容用户的医美行为有所减少&#xff0c;增速放缓至9.9%&#xff0c;随着疫情的好转及…

计算机组成原理-堆栈寻址

文章目录 堆栈寻址软堆栈vs硬堆栈小结 堆栈寻址 栈结构后进后出 软堆栈vs硬堆栈 硬堆栈用寄存器实现 软堆栈就是用内存实现 小结 入栈和出栈即栈顶元素位置的变化不同

【计算机网络】滑动窗口 流量控制 拥塞控制 概念概述

参考资料&#xff1a;计算机网络第八版-视频课程

LabVIEW实时建模检测癌细胞的异常

LabVIEW实时建模检测癌细胞的异常 癌症是全球健康的主要挑战之一&#xff0c;每年导致许多人死亡。世界卫生组织指出&#xff0c;不健康的生活方式和日益严重的环境污染是癌症发生的主要原因之一。癌症的发生通常与基因突变有关&#xff0c;这些突变导致细胞失去正常的增长和分…

java--Map集合的遍历方式

1.Map集合的遍历方式之一&#xff1a;需要用的Map的如下方法 2.Map集合的遍历方式二&#xff1a;键值对 3.Map集合的遍历方式三&#xff1a;Lambda 需要用的Map的如下方法

mybatis-plus使用达梦数据库处理枚举类型报错的问题

使用mybatis-plus连接达梦数据库&#xff0c;枚举类型无法读取 枚举类&#xff1a; 实体&#xff1a; 数据库字段&#xff1a; mybatis-plus枚举包配置&#xff1a; 调用查询方法&#xff1a; List<QualityRuleTemplate> qualityRuleTemplates ruleTemplateServic…

可视化监控云平台/智能监控EasyCVR如何使用脚本创建ramdisk挂载并在ramdisk中临时运行

视频云存储/安防监控EasyCVR视频汇聚平台基于云边端智能协同&#xff0c;支持海量视频的轻量化接入与汇聚、转码与处理、全网智能分发、视频集中存储等。安防管理视频平台EasyCVR拓展性强&#xff0c;视频能力丰富&#xff0c;具体可实现视频监控直播、视频轮播、视频录像、云存…