1.为什么我会想要来弄弄vue这个前端框架呢?

答:前段时间被小程序刷屏了,然后就去弄了一下小程序,嗯挺简单的;头脑一发热后就想到vue2也发布一段时间了,何不也来尝尝vue2.0的味道,最后发现它们俩长得太相近了,呵呵:-)。

2.关于我是怎么学这个框架的?

答:因为没人指导,也没有找视频看(其实是不方便看),最后只能自己在浏览器中摸索前进,我会把我摸到的相关链接放到这里以此备用,写到这里拥抱下自己。

3.你怎么这么啰嗦,还没有进入正文?

答:得咧,现在立马进入。

-----------------------我是华丽丽的分割线-----------------------

首先当然得放上官网参考文档,不然该怎么进行的下去^_^。

戳一下有官网教程链接

(再戳一下看API 咯)

前面的安装生产环境呀等我就不说了,反正跟着官网指引准没错的。

现在开始介绍部分!

◆ 什么是vue 

  Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架,采用自底向上增量开发的设计。Vue 的核心只关注视图层,也就是说是MVVM(Model-View-ViewModel)中VM层,保证视图和数据统一,形成双向数据绑定:-)。

◆ 引用

  <script src=""></script>

  https://unpkg.com/vue/dist/vue.js

  https://npmcdn.com/vue@2.1.9/dist/vue.js

  这个src自己随便选,也可以自己下载。

  推荐 unpkg, 会保持和 npm 发布的最新的版本一致。

◆ Hello World

  html :

 <div id="vm">
<p>{{message}}</p>
</div>

  javascript :

 <script type="text/javascript">
var app=new Vue({
el:"#vm",
data:{
message:"hello vue"
}
})
</script>

附上JSfiddle代码  

https://jsfiddle.net/Chuyue_813/tzb0zptn/5/

啦啦啦,我会不定期的写下来,相互学习!

初试 Vue.js的更多相关文章

  1. Vue.js 基本功能了解

    一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...

  2. Vue.js 基本功能了解一下~

    一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...

  3. Vue.JS React 精彩文章汇总

    JavaScript深入系列  [干货] JavaScript数组所有API全解密  [干货] 移动端:页面->手淘互动动效的探索 - IT大咖说 - 大咖干货,不再错过 [扫盲] Jonath ...

  4. Vue.js 和 MVVM 小细节

    MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...

  5. Vue.js 2.0 和 React、Augular等其他框架的全方位对比

    引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...

  6. 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼?

    引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...

  7. vue.js学习笔记

    有了孩子之后,元旦就哪也去不了了(孩子太小),刚好利用一些时间,来公司充充电补补课,学习学习新技术,在这里做一个整理和总结.(选择的东西,既然热爱就把他做好吧!). 下来进入咱们的学习环节: 一.从H ...

  8. 从Vue.js窥探前端行业

    近年来前端开发趋势 1.旧浏览器逐渐淘汰,移动端需求增加: 旧浏览器主要指的是IE6-IE8,它是不支持ES5特性的:IE9+.chrome.sarafi.firefox对ES5是完全支持的,移动端大 ...

  9. vue.js初探

    前言 入手2016最火前端框架之一vue.js.大概从网上找了些资料看了下vue.js,从网上的资料来看只能惊叹其发展速度太快,让我意外的是其作者是华人的前提下作品这么受欢迎. 网上的博客和教程各种组 ...

随机推荐

  1. Angular中使用$watch监听

    $watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEqua ...

  2. Selenium1 Selenium2 WebDriver

    1.Selenium 1 原理 (1).测试用例(Testcase)通过Client Lib的接口向Selenium Server发送Http请求,要求和Selenium Server建立连接. 为什 ...

  3. ionic项目上划刷新和下拉刷新

    我们想要一块区域实现上划刷新时. 首先需要一块滚动视图:ionCintent 或者 ionScroll 把ion-infinite-scroll当作滚动视图的最后一个子元素,他的on-infinite ...

  4. SQL用法笔记

    1.更改当前记录以外的数据的xh自动加1(MySQL字段为int) String sql = "UPDATE t_readtext as tr SET xh = xh +1\n" ...

  5. js中的分支与循环

    一.js的分支结构 js的分支结构包括:if-else结构.多重if结构.嵌套if结构和switch-case结构 1.if-else结构 1.结构的写法:    if(判断条件){    //条件为 ...

  6. 【Linux Shell】uname命令行

    常用命令uname -v # uname -i #uname -a dream361@master:~$ uname -n #主机名称 master dream361@master:~$ uname ...

  7. Linux 常用性能工具简介

    一.wget 文件下载 使用wget下载单个文件:wget URL 下载并以不同的文件名保存:wget -O wordpress.zip URL wget限速下载:wget --limit-rate= ...

  8. CSS-三栏响应式布局(左右固宽,中间自适应)的五种方法

    代码: <!-- 1 float --> <h3 class="block">第一种方法-float</h3> <div class=&q ...

  9. Flink JobManager HA模式部署(基于Standalone)

    参考文章:https://ci.apache.org/projects/flink/flink-docs-release-1.3/setup/jobmanager_high_availability. ...

  10. Android项目实战(三十四):蓝牙4.0 BLE 多设备连接

    最近项目有个需求,手机设备连接多个蓝牙4.0 设备 并获取这些设备的数据. 查询了很多资料终于实现,现进行总结. ------------------------------------------- ...