如果说是JQuery是手工作坊,那么Vue.js就像是一座工厂,虽然Vue.js做的任何事情JQuery都可以做,但无论是代码量还是流程规范性都是前者较优。
Vue.js的官方中文教程其实也是一个不错的教程,不过相比于一次性把所有概念掌握,我更倾向于先会用,之后再在实际应用中把未涉及到的知识点逐步补全。
就像开车,不是非要知道发动机的工作原理才能上路的,甚至你可能一辈子也不用知道。
好了,开始吧
准备
首先,以下几点希望你已经知道或者做到了:
- 你会用html+css+javascript 写一些网页
- 你知道什么是DOM和BOM(Browser Object Model)
- 你知道Vue.js是一个框架而不是一个新语言
- 你会用百度或者Google其中之一去查找答案
接着,我会围绕以下几个Vue.js的基本(核心)使用方法逐个做测试和使用说明:
- 新建vue对象
- 数据绑定
- 事件绑定
- 表单控件绑定
最后,根据上面的知识点结合起来写出我们的第一个vuejs前端页面
新建Vue对象
- 引用vue.js
在桌面建立一个 Vue.html文件, 然后引入 vue.js的CDN地址 https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js
>
- 新建Vue实例
在Vue.html中插入一个id为firstVue的id="firstVue">>在Vue.html中插入下面js代码:
> > >
id="firstVue">> > >