一起来学习Vue2吧
虽然Vue3已经出来好一阵子了，但就目前而言，Vue2在市场上还是会占一大部分的，因为一些老项目是用Vue2写的，后期维护也是需要Vue2，而且学会Vue2，Vue3你也会的差不多了，到后面稍微看一下理解一下Vue3就差不多了，它俩大差不差。
首先我们要先找到Vue2的网址
Vue.js (vuejs.org)
新的页面打开，Ctrl+S保存下来
然后我们新建一个文件夹，把刚刚的vue.js保存到文件夹中，之后我们用vscode或者HBuilderX打开这个文件件并创建一个html文件。
在head标签里引入我们的vue.js
<script src="你的vue路径/vue.js"></script>
然后我们就可以开始写了。
当然你也可以跟着vue官网去学习，那上边也是有案例，可以试着去理解然后自己再拓展一下。
下面我跟大家提供一个案例
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
{{title}}
<h1>{{job}}</h1>
</div>
</body>
<script>
new Vue({
el: "#app",
data: {
title: "河南火焰山网络科技有限公司",
job: "web前端开发$PHP项目",
}
})
</script>
</html>
将上面代码运行之后会显示下面
我们在script里面new Vue
el是自定义名字，在body里面用id引用
再在data里面自定义名字title和job，在对应的id盒子里面用花括号{{}}引用，这样我们在script里面定义的东西就显示到前端页面了。
大家问为什么教这么简单的东西，因为这是一开始，如果一开始就发深层的东西，多了你们就会看的云里雾里的。
下期我们讲v-if,v-else,v-else-if的用法，思路是和其他语言的if用法一样，只不过多了v-和-，感兴趣的同学可以自行了解一下。
一起来学习Vue2吧相关推荐
- day1学习vue2笔记 vue指令
系列文章目录 day1学习vue2笔记 vue指令 day2 学习vue2 笔记 过滤器 侦听器 计算属性 axios day3 vue2 学习笔记 vue组件 day4 vue 学习笔记 组件 生命 ...
- 学习Vue2.x这一篇就够了
目录 第一章 Vue2.x快速入门 1.1.Vue2.x官网 1.2.Vue2.x介绍 1.3.Vue2.x特点 1.4.Vue2.x入门 1.5.Vue2.x实例 1.5.1.el 1.5.2.da ...
- 学习vue2之安装VueCli
目录 一.安装VueCli 二.创建一个Vue项目 三.目录结构 一.安装VueCli 1.全局安装VueCli(VueCli4.5以上版本对应的是vue3.x,目前我们学习的是vue2.x) npm ...
- vue2学习计划1-2 浏览器跨域问题
这是一个系列,记录我nginx开发常用的代码,小常识,有些是参考网上代码,(讲的可能有点烂,求不要打脸,嘤嘤嘤~~)送给那些需要的人.可以相互交流,喜欢的加我吧. Wx: Lxp911221 最近学习 ...
- Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装
1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...
- Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装 1
1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...
- vue.js2.0 新手开发_VueJs2.0建议学习路线
最近VueJs确实火了一把,自从Vue2.0发布后,Vue就成了前端领域的热门话题,github也突破了三万的star,那么对于新手来说,如何高效快速的学习Vue2.0呢. 既然大家会看这篇文章,那么 ...
- vue2.0 路由不显示router-view
今天学习vue2.0 的 router-view , 爆出的错误不计其数,不知道哪位大神写的router-view,配置的参数竟然不是router,而是routes =_=|| 这是花了一上午整出来的 ...
- vue2知识点：数据代理
文章目录 一.何为数据代理 二.vue中的数据代理 三.回顾Object.defineProperty() 本人其他相关文章链接 一.何为数据代理 数据代理:通过一个对象代理对另一个对象中属性的操作( ...
最新文章
- js高级程序设计之跨浏览器事件处理
- 扩展用户体验之操作栏ActionBar
- yii2 关掉php notice,yii2关闭错误提示
- 忘记 mysql 密码的取回方法
- WinCE下监视设备插拔的参考代码
- OPENSSL 的深入理解
- PHP电子合同对接流程,E签宝电子合同对接实战经验
- 13-Mybatis 注解开发
- Lotus Sametime Server R8.x 标准版部署排错
- archlinux for wps 字体缺失解决办法
- SpringBoot获取访问接口设备的ip地址以及设备类型
- Round Roundup
- java鼠标点击按钮事件_Java学习——GUI编程（鼠标单击按钮事件）
- 使用wxml2canvas将微信小程序页面转为图片
- 服务器断电mysql文件丢失_服务器断电了怎么恢复数据？
- 很抱歉，EXCEL遇到错误，使其无法正常工作，因此需要关闭EXCEL。是否希望我们立即修复？...
- ubuntu搜狗输入法
- 车牌识别C语言源码 第一版
- 制作无后端的静态网页
- 免费好用的IPv6之一个有趣的需求——浅谈Openwrt的VLAN