Vue的学习之安装Vue

news2024/11/23 15:07:22

目录

一、Vue的特点

二、Vue的学习


一、Vue的特点

1.采用组件化模式(xxx.vue包含html+css+js)

2.声明式编码,编码人员无需直接操作DOM,提高开发效率

3.使用虚拟DOM+优秀的DIFF算法(DIFF是用于新旧虚拟DOM的比较),尽量复用DOM节点

学习Vue之前要掌握的js基础知识:

        ES6语法规范

        ES6模块化

        包管理器

        原型、原型链

        数组常用方法

        axios

        promise

        ...

二、Vue的学习

1.大概方向:

着重学习教程和API(类似于查字典,不会就找API)

网址:Vue.js - 渐进式 JavaScript 框架 | Vue.js (vuejs.org)https://cn.vuejs.org/

2.安装Vue.js和Vue.min.js(主要再Vue2里面下载)

网址:Installation — Vue.js (vuejs.org)https://v2.vuejs.org/v2/guide/installation.html#Direct-lt-script-gt-Include

3.引入js文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>01_初始Vue</title>
    <!--引入Vue-->
    <script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
    
</body>
</html>

 这里会遇到两个小问题,需要安装一些东西

4.安装Vue开发者工具

网址:

Vue.js devtools - Microsoft Edge Addonshttps://microsoftedge.microsoft.com/addons/detail/vuejs-devtools/olofadcdnkkjdfgjcmjaadnlehnnihnl

 进入之后,点击获取按钮下载

点击右上角,打开拓展

打开Vue开发者工具,会在网页旁显示图标,就表示安装成功

点击第三步写好的页面进行检查,输入Vue.config,然后回车,出现以下显示就证明可以用了(这样就解决了第一个问题,为什么这里还是会有警告,大家好好思考以下什么原因???)

修改vscode中的productionTip的值为false 

在vue文件中按住ctrl+f打开搜索栏查找,修改productionTip的值

就解决了第二个问题 

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

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

相关文章

《图数据库:理论与实践》书籍销售火爆,二次印刷重磅来袭!

好书共享&#xff0c;就在此刻&#xff01; 由创邻科技联合电子工业出版社匠心打磨三年&#xff0c;最终成稿的图数据库书籍《图数据库&#xff1a;理论与实践》发行上线后&#xff0c;获得了广泛好评&#xff0c;各平台销量迅速破千&#xff0c;并荣登京东 “数据库图书榜”热…

户外LED灯电源维修

户外LED灯防雨电源维修 户外 LED 灯电源损坏&#xff0c;导致 LED 灯不亮&#xff0c;拆下电源&#xff0c;拆出电路板&#xff0c;经过检查因为户外潮湿&#xff0c;导致腐蚀短路&#xff0c;引起全桥硅整流元件 GBU808 损坏&#xff0c;保险丝没有损坏&#xff0c;可以预见其…

SM3在线计算工具

SM3是中华人民共和国政府采用的一种密码散列函数标准&#xff0c;由国家密码管理局于2010年12月17日发布。相关标准为“GM/T 0004-2012 《SM3密码杂凑算法》”。 在商用密码体系中&#xff0c;SM3主要用于数字签名及验证、消息认证码生成及验证、随机数生成等&#xff0c;其算法…

vscode禅模式怎么退出

1、如何进入禅模式&#xff1a;查看--外观--禅模式 2、退出禅模式 按二次ESC&#xff0c;就可以退出。

cesium for unity 打包webgl失败,提示不支持

platform webgl is not supported with HDRP use the Vulkan graphics AR instead.

【深入浅出MySQL】「数据同步架构」分析探索Canal开源技术原理和架构

分析探索Canal开源技术原理和架构 背景说明Canal基本介绍Canal作用方向MySQL同步原理Binlog Dump交互Binlog的协议模型Canal的模拟slave角色Canal的消费订阅 Canal Server模块Canal Instance模块参考资料类似开源项目 背景说明 在早期阶段&#xff0c;阿里巴巴B2B公司由于其在…

cefsharp 修改请求头request.Headers,以实现某种请求验证(v100+已测试)含主要源码和注释

(一)目的:cefsharp实现修改请求头 Tip:网上搜的很多代码都无法实现(要么版本较低,方法有变,要么就行不通),较多的错误是:集合属性只读。其中一个bili网友的测试方法注解一张图,但没有具体代码。参考一下。 (二)实现方法 2.1 创建对象 ChromiumWebBrowser home…

深度解析SD-WAN在企业组网中的应用场景

在现代企业快速发展的网络环境中&#xff0c;SD-WAN技术不仅是实现企业各站点间高效连接的关键&#xff0c;也是满足不同站点对互联网、SaaS云应用和公有云等多种业务需求的理想选择。本文将从企业的WAN业务需求出发&#xff0c;对SD-WAN的组网场景进行全面解析&#xff0c;涵盖…

vscode CMAKE 配置调试

概述 记录使用VSCODE中的CMAKE拓展构建项目时出现的报错 CMakePresets.json&#xff1a; {"version": 6,"configurePresets": [{"name": "x64-debug","displayName": "x64-debug","cmakeExecutable":…

2000-2023年各省名义GDP、实际GDP、GDP平减指数数据(含原始数据+计算过程+计算结果)(以2000年为基期)

2000-2023年各省名义GDP、实际GDP、GDP平减指数数据&#xff08;含原始数据计算过程计算结果&#xff09;&#xff08;以2000年为基期&#xff09; 1、时间&#xff1a;2000-2023年 2、范围&#xff1a;31省 3、指标&#xff1a;名义GDP、国内生产总值指数、实际GDP、GDP平减…

邀请函 | 桥田智能出席AMTS展会 家族新成员正式发布

作为国际汽车制造技术与装备及材料专业展览会&#xff0c;AMTS将于2024年7月3-5日在上海新国际博览中心举行。本届展会以【向“新”而行 “智”领未来】为主题&#xff0c;聚焦汽车及新能源全产业链&#xff0c;围绕“车身工程、部件工程、新能源三电工程及未来汽车开发”等技…

从数据资源到数据资产之数据要素及其市场运作【AMT企源】

题记 本文旨在探讨企业数据资产化的过程中&#xff0c;数据要素及其资产化市场的构成&#xff0c;形成可交易的数据产品的过程&#xff0c;以及如何在大数据交易市场中发挥价值。最后通过一个典型案例的分析&#xff0c;浅谈数据要素的社会化配置与数据资产的入表&#xff0c;…

G7易流赋能化工物流,实现安全、环保与效率的共赢

近日&#xff0c;中国物流与采购联合会在古都西安举办了备受瞩目的第七届化工物流安全环保发展论坛。以"坚守安全底线&#xff0c;追求绿色发展&#xff0c;智能规划化工物流未来"为主题&#xff0c;该论坛吸引了众多政府部门、行业专家和企业代表的参与。G7易流作为…

“用友审批+民生付款”,YonSuite让企业发薪更准时

随着现代企业经营模式的不断创新和市场竞争的加剧&#xff0c;企业薪资管理和发放的效率、准确性和及时性已成为企业管理的重要一环。然而&#xff0c;在实际操作中&#xff0c;许多企业面临着薪资管理复杂、发放流程繁琐、数据不准确等难点和痛点。为了解决这些问题&#xff0…

【AI工具】探索创意与效率:xs.tools 网站介绍

在这个数字化时代,工具的创新和效率对我们的日常工作和生活至关重要。"xs.tools" 网站是一个汇集了众多有趣且实用的小工具的平台,它不仅帮助用户快速找到所需的工具,还能激发灵感,提升创造力。 一、网站概览 "xs.tools" 提供了一个简洁而直观的界面…

利用GD32F470的定时器实现频率和占空比测试

1&#xff09;main函数代码如下&#xff1a; #include "gd32f4xx.h" #include <stdio.h> #include "gd32f470i_eval.h" #include "systick.h"void TIM_PwmInit(void) {rcu_periph_clock_enable(RCU_GPIOA);/* PWM输出管脚为复用推挽模式 …

ssl证书90天过期?保姆级教程——使用acme.sh实现证书的自动续期

腾讯云相关文档相关参考-有的点不准确 前言 最近https到期了&#xff0c;想着手动更新一下https证书&#xff0c;结果发现证书现在的有效期只有90天&#xff0c;于是想找到一个自动更新证书的工具&#xff0c;发现了acme.sh&#xff0c;但是网上的文章质量参差不齐&#xff0…

基于Web的图书管理系统运行教程

1.5、安装数据库和数据库管理工具 目前作者所有毕设源码数据库都用 MySQL5.7版本&#xff0c;强烈建议初学者跟作者保持一致&#xff0c;避免出现其他错误&#xff0c;待运行成功后再根据需要调整数据库版本。 MySQL5.7安装教程请看作者另一篇文章&#xff1a;《MySQL绿色版安…

JavaScript--函数的参数列表以及arguments的用法

函数声明时&#xff0c;参数的问题 即使函数在定义时没有显示声明任何参数&#xff0c;你仍然可以在调用该函数时传递参数。 这是因为 JavaScript 函数内部有一个隐含的 arguments 对象&#xff0c;它包含了所有传递给函数的参数。 示例 我们来通过一些示例代码来更清楚地说…

vue项目中dom拖动排序功能实现

vue项目中拖动元素改变其顺序的功能实现 实现此功能&#xff0c;我利用的是SortableJs,其官网上直接介绍其为功能强大的js拖拽库&#xff0c;只需要简单的代码即可实现dom拖拽 1.下载 npm i sortablejs 2.引入 使用时&#xff0c;我们在那个页面中使用&#xff0c;就在该vue文…