Vue入门基本语法01

big匹诺曹

于 2019-03-21 21:46:33 发布

阅读量162

点赞数

分类专栏： Vue基本语法文章标签： Vue学习

本文链接：https://blog.csdn.net/qq_40369183/article/details/88726986

版权

Vue基本语法专栏收录该内容

1 篇文章 0 订阅

订阅专栏

创建第一个Vue实例：
vue是渐进式JavaScript框架
“渐进式框架”和“自底向上增量开发的设计”是Vue开发的两个概念
Vue可以在任意其他类型的项目中使用，使用成本较低，更灵活，主张较弱，在Vue的项目中也可以轻松融汇其他的技术来开发（来自百度百科）

特点
特点：易用（使用成本低），灵活（生态系统完善，适用于任何规模的项目），高效（体积小，优化好，性能好）
Vue是一个MVVM的js框架，但是，Vue 的核心库只关注视图层，开发者关注的只是m-v的映射关系

Vue三种引入方式：
下面介绍三种 Vue.js 的安装方法：

1.独立版本
我们可以在Vue.js的官网上直接下载vue.js,并在开发环境不要使用最小压缩版，不然会没有错误提示和警告！
2.使用CDN方法

BootCDN（国内） : https://cdn.bootcss.com/vue/2.2.2/vue.min.js ，（国内不稳定）
unpkg：https://unpkg.com/vue/dist/vue.js, 会保持和 npm 发布的最新的版本一致。（推荐使用）
cdnjs :
https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js，如（）

3.NPM方法

在用Vue.js构建大型应用的时候推荐使用NPM安装方法，NPM能很好的和诸如Webpack或者Browserify 模块打包器配合使用。Vue.js 也提供配套工具来开发单文件组件。

下面上一个引用Vue的实例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Vue入门</title>
	<script src="https://cdn.jsdelivr.net/npm/vue"></script>
  </head>
  <body>
    <div id="app">{{msg}}</div>
	<script>
		new Vue({
			el: "#app",
			data: {
				msg: "Vue第一个实例"
			}
		})
	</script>
  </body>
</html>

在这里插入图片描述