Vue.js

作者: 源大侠 | 来源:发表于2017-04-18 19:23 被阅读0次

首先回顾几个关键字:

MVC 、MVVM、model 数据模型、view视图、controller 控制器、module模块、虚拟dom 【在js当中模拟dom树,在数据发生变化时候,会进行dom和虚拟dom的对比,针对变化的dom进行更新】

虚拟dom的一个技术帖

vue 的特点:

1:相比于angular,vue简化了很多的功能;

2:指令和组件,在angular烛龙指令和自定义的标签是混在一起的

3:性能还,体积小,不使用脏查询;虚拟dom

4:灵活,渐进式的技术栈

vue 的使用:

一:数据绑定:

1:{{}}可以使用js表达式;包括三目运算,但是不包括if判断

2:v-once ; 数据不会再次变化,只绑定一次

3:v-html: 可以应用html结构

二:常用指令:

1:v-for:  value 、 index、 key  、 trank-by (1.x版本)

类似于angular中的ng-repeat

2:v-model: 将数据模型绑定到输入框中;

3:v-if :v-else-if : v-else;

v-if 于 v-show 的区别;

v-show 是隐藏或者显示元素

v-if 是渲染不渲染的问题,标签都没有了;

v-else 是必须更在v-if后面    v-else-if;

4:v-show 指令元素是否显示

5:v-bind:可以绑定任意属性;比如:class 、 style 、 disable

可以接受表达式;可以接受数组;

6:v-on :

事件监听:事件处理-- methods : 事件对象;

事件修饰符:

阻止冒泡:stop;

阻止默认行为:prevent

事件捕获:capture

自身触发:self;

单次事件:once;

按键修饰符:可以绑定指定的按键;

三:组件:

全局:component

1:template:组件展示的模板;只能拥有一个父级;

注意:特殊标签需要用到is关键字

2: data :是一个函数,定义当前组件的数据类型;

3:props: 作用:可以将父级的数据传递给予子级的组件;

                    语法:字面量     ;   动态  ;   

                    特性:单项数据流;

                     事件:监听事件$on

                    触发事件:$emit

4:slot:多发内容; -slot

   多个slot

5components  局部

相关文章

  • Vue.js动态组件解析

    此前的Vue.js系列文章: Vue.js开发常见问题解析 Vue.js常用开发知识简要入门(一) Vue.js常...

  • 【MAC 上学习 Vue】Day 1. 创建 Hello Wor

    下载 Vue.js Vue.js 开发版本下载地址为:https://vuejs.org/js/vue.js 安装...

  • Vue 循环、点击、双向绑定

    一、了解 Vue.js 1 Vue.js是什么? Vue.js是一套用于构建用户界面的渐进式框架。Vue.js通过...

  • Vue.js入门

    Vue笔记系列2、Vue.js渐进3、Vue.js进阶 Vue.js的概述 如官网所说,Vue.js是一款轻量级的...

  • Vue起步

    Vue.js官网 Vue.js教程 1. Vue.js起步 Vue.js有两种方式:引入CDN方式或使用命令行工具...

  • MAC上学习Vue---Day1. 创建Hello World

    下载Vue.js Vue.js开发版本地址为: https://vuejs.org/js/vue.js 安装VS ...

  • 一.Vue.js起步

    1 Vue.js Vue.js官网 Vue.js菜鸟教程 2 MVVM模式 MVC:Model-Viel-Cont...

  • Vue.js 第一天

    Vue.js 一、Vue.js简介 1.Vue.js 是什么 vue.js 也称为Vue,读音 /vju:/ ,类...

  • 《Vue.js 实战》基础篇(上)

    本章内容:认识 Vue.js、数据绑定、计算属性、内置指令 一、初始 Vue.js 1.1 Vue.js 是什么 ...

  • Vue.js基础

    1 vue.js研究 1.1 vue.js介绍 1、vue.js是什么?Vue (读音 /vjuː/,类似于 vi...

网友评论

      本文标题:Vue.js

      本文链接:https://www.haomeiwen.com/subject/wkjqzttx.html