vue官网链接:https://cn.vuejs.org/

一. vue简介

  vue目前分为2.X版和3.X版,本文以2.X版为准,后续会更新3.X版本相关教程,建议从2.X版开始学起,因为此版本经过时间的沉淀,版本稳定、网上教程也多,方便入手。

  vue的特点是易用、灵活、高效。

  学习vue要有html、css、javascript的基础,建议这三项技术都学习过,并能够完完整整的做过一些项目再学习vue,否则即使跟着教程做也会错误百出。

二. vue使用

  话不多说,直接来看看如何使用vue,通过vue官网下载好vue 2.X版本后,新建html文档(保持和vue.js同目录)

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<script src="vue.js"></script>
<style> </style>
</head> <body> <div id="app">{{name}}</div> <script>
new Vue({
el:'#app',
data:{
name:'sparrow'
}
});
</script>
</body> </html

  

1.0 vue开篇之作的更多相关文章

  1. [.net 面向对象程序设计深入](0) 开篇

    [.net 面向对象程序设计深入](0)开篇        [.net 面向对象编程基础]和 [.net 面向对象程序设计进阶]在15年底写完了,群里也加进来不少热爱学习的小伙伴.让我深切感受到在这个 ...

  2. Vue 2.0 + Vue Router + Vuex

    用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...

  3. vue 2.0 vue.set的使用方法

    这里我定义了一个列表数据,我将通过三个不同的按钮来控制列表数据. 首先在列表中动态新增一条数据: <!DOCTYPE html><html><head lang=&quo ...

  4. Android 底部TabActivity(0)——开篇(界面分析|系列文章文件夹)

    当下主流的软件没有一个统一明白的风格,App框架什么样的都有,但个人钟情于页面底部Tab分签架构,移动设备的屏幕尽管越来越大,可是显示的内容还是有限,为了能展示很多其它的内容,方便简洁的操作习惯中Ta ...

  5. vue3.0 vue.config.js 配置实战

    今天讲述一下vue-config.js配置,我们前面搭建好脚手架会发现,这个对比2.x版本少了很多东西,没有build的配置,也没有webpack的配置,那么问题来了,我们如何去开发我们的项目呢,比如 ...

  6. Vue-Cli 3.0 + vue.config.js

    虽然一直没有亲手搭建过vue项目,但是2.0的时候就开始自学(但并没有实践项目).然后公司最近有个人用3.0做了个项目,公司让我参与进去,我就顺便学习了一把3.0.(美滋滋) 因为电脑的环境还是之前自 ...

  7. ThinkPHP6.0 + Vue + ElementUI + axios 的环境安装到实现 CURD 操作!

    官方文档地址: ​ ThinkPHP6.0: https://www.kancloud.cn/manual/thinkphp6_0/1037479 ​ ElemetUI: https://elemen ...

  8. vue-cli3.0 vue脚手架3.0的使用

    1.安装vue-cli 3.0 npm install -g @vue/cli # or yarn globaladd @vue/cli 安装成功后查看版本:vue -V(大写的V)     2.命令 ...

  9. vue-cli3.0 vue组件发布到npm

    一.创建项目 1.vue create xxx (使用的版本是3.1.0) 2.把src目录名称改为examples 3.新建文件夹packages 用来存放组件 4.比如:新建Button组件 in ...

随机推荐

  1. 算法 | 串匹配算法之KMP算法及其优化

    主串 s:A B D A B C A B C 子串 t:  A B C A B 问题:在主串 s 中是否存在一段 t 的子串呢? 形如上述问题,就是串匹配类问题.[串匹配--百度百科] 串匹配问题是一 ...

  2. 顺利通过EMC实验(13)

  3. 'utf-8' codec can't decode byte 0x8b in position 1: invalid start byte

    问题描述:在使用python爬取斗鱼直播的数据时,使用str(读取到的字节,编码格式)进行解码时报错:'utf-8' codec can't decode byte 0x8b in position ...

  4. css换算rem单位

    地址:https://www.freetechs.cn/tool/rem2px.html

  5. swig模板引擎和ejs模板引擎

    swig模板引擎的基本用法: 1. 变量 {{ name }}  //name名前后必须要加空格,不加就会报错 2. 属性 {{ student.name }} 3. 模板继承 swig使用exten ...

  6. 数据库纳管平台DBhouse的技术路线与实践

    为帮助开发者更好地了解和学习前沿数据库技术,腾讯云数据库特推出"DB · TALK"系列技术分享会,聚焦干货赋能创新,邀请数十位鹅厂资深数据库专家每月和您一起深入探讨云数据库的内核 ...

  7. SprigCloud入门踩坑之创建bean失败

    昨天也是报同样的错误,恰好要去吃饭,着急就没找到问题,把项目删了,后续看了路飞大佬的通过pom导入依赖的方式,但是资源导入太慢随放弃. 昨晚熄灯前二十分钟又从头敲了一遍,敲好就断电了,没来得及启动,今 ...

  8. 图片叠加科幻切换 -- css

    <template> <div>   <div class="a"></div> <div class="b&quo ...

  9. 2021.11.03 P2886 [USACO07NOV]Cow Relays G(矩阵+floyed)

    2021.11.03 P2886 [USACO07NOV]Cow Relays G(矩阵+floyed) [P2886 USACO07NOV]Cow Relays G - 洛谷 | 计算机科学教育新生 ...

  10. 从小白到侠客的 Windows 快捷键宝典

    "天下 武功,唯快不破."你是否羡慕过那些电脑键盘侠客,他们操作起电脑行云流水,任务完成的又快又准.这到底是怎么做到的呢?我们是否也能向他们一样达到把键盘操作熟记于心呢?那就跟着笔 ...