初试 Vue.js
1.为什么我会想要来弄弄vue这个前端框架呢?
答:前段时间被小程序刷屏了,然后就去弄了一下小程序,嗯挺简单的;头脑一发热后就想到vue2也发布一段时间了,何不也来尝尝vue2.0的味道,最后发现它们俩长得太相近了,呵呵:-)。
2.关于我是怎么学这个框架的?
答:因为没人指导,也没有找视频看(其实是不方便看),最后只能自己在浏览器中摸索前进,我会把我摸到的相关链接放到这里以此备用,写到这里拥抱下自己。
3.你怎么这么啰嗦,还没有进入正文?
答:得咧,现在立马进入。
-----------------------我是华丽丽的分割线-----------------------
首先当然得放上官网参考文档,不然该怎么进行的下去^_^。
前面的安装生产环境呀等我就不说了,反正跟着官网指引准没错的。
现在开始介绍部分!
◆ 什么是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的更多相关文章
- Vue.js 基本功能了解
一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...
- Vue.js 基本功能了解一下~
一.写在前面 隔了这么久才来出Vue的第二篇文章,真是堕落了,自己先惩罚下/(ㄒoㄒ)/~~ 回过头看自己第一篇相关文章<初试 Vue.js>(http://www.cnblogs.com ...
- Vue.JS React 精彩文章汇总
JavaScript深入系列 [干货] JavaScript数组所有API全解密 [干货] 移动端:页面->手淘互动动效的探索 - IT大咖说 - 大咖干货,不再错过 [扫盲] Jonath ...
- Vue.js 和 MVVM 小细节
MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...
- Vue.js 2.0 和 React、Augular等其他框架的全方位对比
引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...
- 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼?
引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...
- vue.js学习笔记
有了孩子之后,元旦就哪也去不了了(孩子太小),刚好利用一些时间,来公司充充电补补课,学习学习新技术,在这里做一个整理和总结.(选择的东西,既然热爱就把他做好吧!). 下来进入咱们的学习环节: 一.从H ...
- 从Vue.js窥探前端行业
近年来前端开发趋势 1.旧浏览器逐渐淘汰,移动端需求增加: 旧浏览器主要指的是IE6-IE8,它是不支持ES5特性的:IE9+.chrome.sarafi.firefox对ES5是完全支持的,移动端大 ...
- vue.js初探
前言 入手2016最火前端框架之一vue.js.大概从网上找了些资料看了下vue.js,从网上的资料来看只能惊叹其发展速度太快,让我意外的是其作者是华人的前提下作品这么受欢迎. 网上的博客和教程各种组 ...
随机推荐
- Angular中使用$watch监听
$watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEqua ...
- Selenium1 Selenium2 WebDriver
1.Selenium 1 原理 (1).测试用例(Testcase)通过Client Lib的接口向Selenium Server发送Http请求,要求和Selenium Server建立连接. 为什 ...
- ionic项目上划刷新和下拉刷新
我们想要一块区域实现上划刷新时. 首先需要一块滚动视图:ionCintent 或者 ionScroll 把ion-infinite-scroll当作滚动视图的最后一个子元素,他的on-infinite ...
- SQL用法笔记
1.更改当前记录以外的数据的xh自动加1(MySQL字段为int) String sql = "UPDATE t_readtext as tr SET xh = xh +1\n" ...
- js中的分支与循环
一.js的分支结构 js的分支结构包括:if-else结构.多重if结构.嵌套if结构和switch-case结构 1.if-else结构 1.结构的写法: if(判断条件){ //条件为 ...
- 【Linux Shell】uname命令行
常用命令uname -v # uname -i #uname -a dream361@master:~$ uname -n #主机名称 master dream361@master:~$ uname ...
- Linux 常用性能工具简介
一.wget 文件下载 使用wget下载单个文件:wget URL 下载并以不同的文件名保存:wget -O wordpress.zip URL wget限速下载:wget --limit-rate= ...
- CSS-三栏响应式布局(左右固宽,中间自适应)的五种方法
代码: <!-- 1 float --> <h3 class="block">第一种方法-float</h3> <div class=&q ...
- Flink JobManager HA模式部署(基于Standalone)
参考文章:https://ci.apache.org/projects/flink/flink-docs-release-1.3/setup/jobmanager_high_availability. ...
- Android项目实战(三十四):蓝牙4.0 BLE 多设备连接
最近项目有个需求,手机设备连接多个蓝牙4.0 设备 并获取这些设备的数据. 查询了很多资料终于实现,现进行总结. ------------------------------------------- ...