vuejs是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。如果你之前已经习惯了用jQuery操作DOM，学习Vue.js时请先抛开手动操作DOM的思维，因为Vue.js是数据驱动的，你无需手动操作DOM。它通过一些特殊的HTML语法，将DOM和数据绑定起来。一旦你创建了绑定，DOM将和数据保持同步，每当变更了数据，DOM也会相应...
vue这个新的工具，确实能够提高效率，在经历的一段时间的摧残之后，终于能够有一个系统的认识了，下面就今天的收获做一个总结，也是vue入门的精髓： 1.要使用vue来开发前端框架，首先要有环境，这个环境要借助于node，所以要先安装node，借助于node里面的npm来安装需要的依赖等等。 这里有一个小技巧：如果在cmd中直接使用npm来安装的一些工具的话会比较慢，所以我们使用淘宝的npm镜像： 输入npm install -g cnpm –registry=http...
vue-router 快速入门 配置路由 $ npm install vue-router --save routes.js import Home from ./pages/Home.vue import Gifs from ./pages/Gifs.vue import User from ./pages/User.vueexport const routes = [{ path: , component: Home },{ path: /gifs, component: Gifs },{ path: /user/:id, component: User }//指定路由和对应要渲染的组件//404的path应该是*,要放在最末尾，当前面的都匹配不到时才匹配到404页面//this.$rout...
首先在页面引入vue.js以及其他需要用到的或者可能要用到的插件（这里我多引用了bootstrap和jquery）引用的时候需要注意文件的路径，准备工作这样基本就完成了，下面正式开始入门。 vue.js最重要的一个特点就是双向数据绑定也就是我们常说的MVVM：Model-View-ViewModel。我们要实现双向绑定首先当然要有“双向”，这里vue.js为我们提供了View层和Model层。View层就是在HTML中的代码，Model层则是Javascript代码。 下面是一个最基础的...
一、什么是Vue？ Vue.js（读音 /vju?/, 类似于 view） 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。如果你是有经验的前端开发者...
基础Vue.js 允许你注册自定义指令，实质上是让你教 Vue 一些新技巧：怎样将数据的变化映射到 DOM 的行为。你可以使用Vue.directive(id, definition)的方法传入指令id和定义对象来注册一个全局自定义指令。定义对象需要提供一些钩子函数（全部可选）： bind: 仅调用一次，当指令第一次绑定元素的时候。update: 第一次是紧跟在 bind 之后调用，获得的参数是绑定的初始值；以后每当绑定的值发生变化就会被调用，获得新值与旧值两个参数...
组件简介 组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树：那么什么是组件呢？组件可以扩展HTML元素，封装可重用的HTML代码，我们可以将组件看作自定义的HTML元素。 由于组件的篇幅较大，我将会把组件的入门知识分为两篇来讲解，这样也便于各位看官们快速消化。 组件的创建和注册 基本步骤 Vue.js的组件的使用有3个步骤：创建...
本篇将简单介绍一下Vue.js，并在Node.js环境下搭建一个简单的Demo。 一、简介 我个人理解，Vue.js是一套前端视图层的框架，它只关心视图展示和数据绑定，它的一些语法与Angular 1非常相似，如果有Angular 1相关的使用经验，上手会非常快。 相比较其他的React、Angular 2等MVVM框架，它更加的轻量，效率也更高，也能更好的与其他库集成。 它拥有以下几个出色的特性： 数据双向绑定指令模板组件当前最新的版本为2.1.4。后续也会在这个...
vue2.0 据说也出了很久了，博主终于操了一次实刀。 整体项目采用 vue + vue-router + vuex （传说中的vue 全家桶），构建工具使用尤大大推出的vue-cli 项目是图片分享社交平台。 项目预览： 1 .vue-cli构建工具必知 我选用的vue-cli 是基于webpack的版本 ，不了解webpack的可以先粗略看下下面的基本知识 webpack 基本知识点： entry：入口点，webpack会从入口点设置的js文件开始对项目进行构建，过程中，所有入口点通过impo...
本文介绍vue.js组件，具体如下： 5.2 组件通信 尽管子组件可以用this.$parent访问它的父组件及其父链上任意的实例，不过子组件应当避免直接依赖父组件的数据，尽量显式地使用 props 传递数据。另外，在子组件中修改父组件的状态是非常糟糕的做法，因为： 1.这让父组件与子组件紧密地耦合； 2.只看父组件，很难理解父组件的状态。因为它可能被任意子组件修改！理想情况下，只有组件自己能修改它的状态。 每个Vue实例都是一个事件触发...
接着上一篇vue慢速入门教程学习。 4.组件使用基础 什么是组件？组件可以理解为可重用的自定义HTML。 可以使用一堆组件来构造大型应用，任意类型的应用界面都可以抽象为一个组件树：可以把组件代码按照template、style、script的拆分方式，放置到对应的.vue文件中。 组件预定义选项中最核心的几个：模板（template）、初始数据（data）、接受的外部参数（props）、方法（methods）、生命周期钩子函数（lifecycle hooks）。 4.1 基本...
.btn-demo {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;background-color: #19b586;text-decoration: none;border: none;border-radius: 4px;color: #fff !important;text-decoration: none !important;cursor: pointer;display: inline-block;font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;font-size: 18px;font-weight: 700;line-height: 1.5;text-align: center;text...
Vue.js是当下很火的一个JavaScript MVVM库，它是以数据驱动和组件化的思想构建的。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js。 0.MVVM什么是MVVM？就是Model-View-ViewModel。ViewModel是Vue.js的核心，它是一个Vue实例。 不太懂也没关系，慢慢就懂了。 1.基础示例 代码： <!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1...
什么是vue vue是法语中视图的意思，Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API。 一、基本结构 index.html代码： <script src="../vue.js"></script> <div id="app"> {{ message }} </div> <script src="app.js"></script> <!--注意：app.js要最后引入，因为要先有id为app的div,vue才能获取相应的元素。否则会报错： [Vue warn]: Cannot find element: #app-->app.js代码： new Vue({ el: #app...
前言 vuejs——轻量、学习成本低、双向绑定、无dom的操作、组件的形式编写 vuejs是个轻量级的mvvm框架， 集合了angular的基本功能，却又比angular更为精简，功能上涵盖了双向绑定、指令、逻辑控制、过滤器、事件监听、函数等。框架的特点使得项目 在状态变更、分页的场景下可以拥有很大的便利——所有的操作只需要变更数组，没有任何的dom操作。 webpack——CommonJS的引用和编写方式、loader非常的丰富，包括vue-loader、css-load...