脚本宝典收集整理的这篇文章主要介绍了从零开始学Vue,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
Vue是一个小巧轻便的JavaScript库。它有一个简单易懂的API,能够让开发者在开发web应用的时候更加简易便捷。实际上,一直让Vue引以为豪的是它的便捷性、执行力、灵活性。
这篇教程的目的就是通过一些例子,让你能够概览一些基本的概念和特性。在接下来的其他教程里,你会学到Vue更多的有用的特性,从而用Vue搭建一个可扩展的项目。
我们可以先初始化一个htML页面,然后我们需要引入Vue 的 js 文件。引入的方式有很多,我们可以在script中引入Vue的cdn,或者去官网上下载Vue的min.js,或者用 npm 安装一个Vue的依赖。方便起见,本文中就用cdn引入。
<!DOCTYPE html>
<html>
<head>
<title>从零开始学Vue</title>
</head>
<body>
<script src="http://cdn.jsdelivr.net/vue/1.0.16/vue.js"></script>
</body>
</html>
当你在开发过程中,确保你使用的是没有压缩过的版本,因为没有压缩的版本会提供有用的详细的警告,将会给你的代码书写节省很多时间。
我们先在body里面写入一个div,并且创建一个Vue实例,然后将实例和div绑定起来。
当你创建一个新的Vue实例的时候要使用Vue()构造器,然后在你的实例中指出你的挂载点。这个挂载点就是你想要划分出来的Vue实例的边界。挂载点和实例边界是一一对应的,你只能在挂载点上处理你实例边界内的事务,而不能在你的挂载点上处理实例边界外的事务。
在Vue实例中设置挂载点的参数是 “ el ”,el 的值可以用dom元素定义。