1.vue基础(一)引入vue.js-程序员宅基地

技术标签: 前端-vue  html5  vue.js  


个人是跟着尚硅谷的课程做的笔记****

-----个人第一篇博客,纯是记录自己学习的过程,有哪些错误请各位大神指点----

1.直接引入vue.js文件

<script type="text/javascript" src="../js/vue.js"></script>

文件在vue官网可以直接下载。

2.CDN

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

3.注意事项(其中的小问题)

注意:运行之后控制台会报两个小提示(不是错误啊!!!!)

image-20220412182222986

一、第一个小提示的意思是:推荐你在谷歌浏览器上安装官方推出的vue开发者工具。

解决办法:安装vue开发者工具,步骤如下:

  1. 打开vue官网,在安装目录下的vue devtools目录中,点击图中的红框。

  2. 会打开一个github网址,点击图中的红框。

  3. 点击图中的红框。

  4. 点击下载(我这里是删除,因为我安装了。打开谷歌的应用商店,这里需要FQ,或者到我的下载里下载即可,不需要积分哦!!!)

  5. 如何验证插件安装成功呢,在你浏览器的右上方会有一个vue的小图标,为什么没亮呢,因为你还没用vue呢。在我这里下载的人,怎么安装呢???打开谷歌浏览器,右上角三个点->更多工具->扩展程序->右上角打开开发者模式,把文件直接拖进去即可哦!!!

  6. 安装完成后,必须进入到扩展程序,找到 vue-devtools 详情信息,把允许访问文件网址打开,然后在你的script中添加下面这段代码

    Vue.config.devtools = true;
    
  7. 然后使用F12来打开开发工具栏,就成功啦

image-20220412191241225 image-20220412191642166 image-20220412191915349 image-20220412191930383

image-20220412193904132

image-20220414101349131

image-20220414101425870

二、第二个小提示的意思是:你正在使用开发者版本的vue,请在生产环境不要使用。

解决办法:把生产提示关掉(具体操作:在body中添加如下代码)

    <script type="text/javascript">
        Vue.config.productionTip = false;//阻止vue在启动时生成生产提示。
    </script>

三、so怎么验证引入vue成功?

在控制台输入Vue(会自动提示),然后回车,会输出代码。
在这里插入图片描述

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_41634943/article/details/124165684

智能推荐

数据结构和算法——Huffman树和Huffman编码详解_huffman树,huffman编码-程序员宅基地

文章浏览阅读623次。Huffman树是一种特殊结构的二叉树,由Huffman树设计的二进制前缀编码,也称为Huffman编码在通信领域有着广泛的应用。在w..._huffman树,huffman编码

spring报错java.sql.SQLException: The server time zone value '�й���׼ʱ��' is unrecognized or represents_gradle :-程序员宅基地

文章浏览阅读388次。数据库的url后面添加&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=UTC例如,完整代码为:url: jdbc:mysql://localhost:3306/test?characterEncoding=utf-8&useJDBCCompliant..._gradle :

电脑硬件——显卡_显卡分类-程序员宅基地

文章浏览阅读3.9k次,点赞20次,收藏86次。显卡的工作是负责画面的渲染和输出,例如你在玩一个大型游戏,CPU的工作是根据游戏预设的各种算法计算出接下来会发生什么,并折合成海量的数据发送给显卡,显卡再对这些数据进行计算,渲染成1帧1帧的图像,传输到显示器,从而将画面呈现在我们眼前,而且显卡是在实时计算渲染,所以对显卡性能的要求就非常高,因此这就是我们平常所说的你想打游戏,就得有一张好的显卡。而看视频就不一样了,视频资源是已经被计算好的数据,先看只负责简单处理再输出就可以了,不需要再自己计算。就类比写作业,玩游戏就是自己计算然后写在本子上,看视频就是抄作_显卡分类

点云配准经典算法ICP复现 C++ Win10 pcl1.11.1_method for registration of 3-d shapes-程序员宅基地

文章浏览阅读1.7k次,点赞4次,收藏25次。背景ICP算法是点云配准(registration)领域的主流算法,在学习过程中我尝试使用C++复现了ICP算法。我参考的是经典ICP论"P. Besl, N. McKay. ‘A Method for Registration of 3-D Shapes,’ IEEE Trans. on Pattern Analysis and Machine Intel., vol. 14, no. 2, pp. 239-256,1992"。建议论文和代码搭配阅读。环境windows10 + pcl1.11.1_method for registration of 3-d shapes

springmvc的前端控制器对css、js等进行过滤_spring 过滤js代码-程序员宅基地

文章浏览阅读3.7k次。web.xml配置如下: springm_spring 过滤js代码

游戏中任务系统设计_游戏任务种类-程序员宅基地

文章浏览阅读8.5k次,点赞2次,收藏17次。1、任务分类 游戏中任务可以分为主线任务、支线任务、日常任务、周任务、节日活动任务,其中周任务和节日任务可以根据设定的日期进行开启关闭,属于重复性任务。2、游戏条件 各类任务开启条件:1、玩家等级 2、玩家攻击力3、前置任务等等 完成条件:玩家进行任务进度是否达成 任务关闭:1、玩家领取奖励后关闭任务。2、时间过期3..._游戏任务种类

随便推点

SpringCloud集成Feign报错:feign.FeignException$NotFound: status 404 reading UserFeign#userList()_fserviceclient-程序员宅基地

文章浏览阅读1.2k次。解决方式 第一百度看看是不是你得路径写错了第二 客户端 中@FeignClient(contextId="fServiceClient",value=ServiceNameConstants.DEMO_SERVICE) 注解value得值必须是你要访问得 那个客户端标题是借别人得 内容是自己遇到得 网上一搜索全是请求路径不对 反复验证了路径 全对就是请求不到,因为自己没有springcloud 知识 (每日一问啥时候学)所以正常知道springcloud 知识得人不会遇..._fserviceclient

oracle 查询是否包含某字符串_oracle包含某个字段-程序员宅基地

文章浏览阅读7.9k次,点赞4次,收藏9次。1、like 2、contains 3、instr 4、regexp_like_oracle包含某个字段

骨架提取之AdaLSN_线性跨度网络-程序员宅基地

文章浏览阅读1.1k次,点赞2次,收藏10次。paper:https://arxiv.org/pdf/2011.03972.pdfcode:https://github.com/sunsmarterjie/SDL-Skeleton摘要传统的物体骨架检测网络通常是手工制作的。 虽然有效,但它们需要密集的先验知识来为不同粒度的对象配置具有代表性的特征。 本文提出了自适应线性跨度网络(AdaLSN),在神经架构搜索(NAS)的驱动下,自动配置和集成目标骨架检测的尺度感知特征。AdaLSN是用线性跨度理论建立的,它为多尺度深度特征融合提供了最早的解释之一_线性跨度网络

python的内存管理机制_python 创建金字塔 显示大内存图片-程序员宅基地

文章浏览阅读662次。python的内存管理机制先从较浅的层面来说,Python的内存管理机制可以从三个方面来讲(1)垃圾回收(2)引用计数(3)内存池机制一、垃圾回收:python不像C++,Java等语言一样,他们可以不用事先声明变量类型而直接对变量进行赋值。对Python语言来讲,对象的类型和内存都是在运行时确定的。这也是为什么我们称Python语言为动态类型的原因(这里我们把动态类型可以简单的归结为对变量内存地址_python 创建金字塔 显示大内存图片

Qt多语言支持_qt translate file语言选什么-程序员宅基地

文章浏览阅读547次。试用QT中的多语言翻译基本原理:为了在使用多语言,必须做两件事情:1,把想要翻译的字符串放入tr()中,如 QString str=tr("Legal");2, 在开始的时候载入预先制作好的翻译文件(.qm)。以下利用Qt提供的工具,把翻译文件制作出来,并在程_qt translate file语言选什么

Atitit 性能指标与性能提升的5个原则与性能提升模型_升级性能指标-程序员宅基地

文章浏览阅读433次。Atitit 性能指标与性能提升的5个原则与性能提升模型 1. 性能的几个指标主要是响应时间(Response time) 2.吞吐量(Throughput)12. 性能提升的5个原则与性能提升模型 22.1. 分类优先级,与分区域,减少要操作或提取的内容与范围 22.2. div分而治之 聚沙成塔 分布式并发 22.3. 大力提升单体处理能力 22.4. _升级性能指标

推荐文章

热门文章

相关标签