VUE 是个 M V VM框架
vue基本使用
new出来一个Vue的实例,传一堆配置参数,控制一片html
VM: 响应系统 - > vDOM做标记 ->一个循环周期结束后->操作DOM
new Vue 返回 VM
new Vue({
el:'选择器' 要控制的那片html代码
data:{key:value}数据
methods:{fnName:fn} 方法
})
M: 初始化数据
data 选项 number/string/boolean/array/json/undefined/null
V: 数据绑定 插值表达式|指令|属性
{{数据名}} 模板 mustache 插值表达式 声明式渲染
v-text="数据名" vue特有的属性(指令) (不解释标签)
v-html="strong" 非转义输出 ( 解释标签)
v-for="(val,index) in 数据" val值 index索引 变量数组、对象
默认 :key="index" 指定key 是个bmw字符 vue是认得 修改VDom的key值
:key="item.id" 指定key 是数据id(唯一性) 修改VDom的key值
key的优势: 避免数据错乱导致的视图问题,提供性能
v-bind:html属性="数据" 普通的html属性绑定数据
:html属性="数据" 简写 title/src/url/
事件:
v-on:事件名="方法"
@事件名="方法" 简写
@事件名="方法(参数)"
@事件名="方法($event,参数)" methods:{方法:function(ev,参数){ev/event}}
注意:vue提供的选项的值如果是函数时,不可用箭头函数
VUE 是个 M V VM框架的更多相关文章
- 如何实现VM框架中的数据绑定
作者:佳杰 本文原创,转载请注明作者及出处 如何实现VM框架中的数据绑定 一:数据绑定概述 视图(view)和数据(model)之间的绑定 二:数据绑定目的 不用手动调用方法渲染视图,提高开发效率:统 ...
- 基于Vue的Quasar Framework 介绍 这个框架UI组件很全面
基于Vue的Quasar Framework 介绍 这个框架UI组件很全面 基于Vue的Quasar Framework 中文网http://www.quasarchs.com/ quasarfram ...
- 终于 Vue.js 成为世界一流的框架
终于 Vue.js 成为世界一流的框架 随着美团开源基于 Vue.js 的微信小程序框架 mpvue, Vue.js 在微信小程序端的能力被补齐,于是 Vue.js 成为了一个唯一能在 Web, H5 ...
- 使用vue,react,angular等框架和不使用框架使用jquery的优缺点
jquery和vue react等框架有着本质上的区别,从jquery到vue.react 或者说是到mvvm的转变,是一个思想的转变,是将原有的直接操作dom的思想转变到操作数据上去. vue更关注 ...
- 基于vue实现一个简单的MVVM框架(源码分析)
不知不觉接触前端的时间已经过去半年了,越来越发觉对知识的学习不应该只停留在会用的层面,这在我学jQuery的一段时间后便有这样的体会. 虽然jQuery只是一个JS的代码库,只要会一些JS的基本操作学 ...
- angular vue react web前端三大主流框架的对比
首先,我们先了解什么是MVX框架模式? MVX框架模式:MVC+MVP+MVVM 1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分 ...
- 在vue或者react中使用express框架
在react 或者 vue项目中使用express框架 1.创建vue或者 react 项目 2.在项目中创建server文件夹,创建server.js //require()方法引入express模 ...
- vue、react、angular三大框架对比 && 与jQuery的对比
前端当前最火的三大框架当属vue.react以及angular了. 但是在做项目的时候,我们怎么去选择呢? 这里做一个比较,希望大家可以有一个比较清晰的认识. vue与react vue和react ...
- 更轻更快的Vue.js 2.0与其他框架对比(转)
更轻更快的Vue.js 2.0 崭露头角的JavaScript框架Vue.js 2.0版本已经发布,在狂热的JavaScript世界里带来了让人耳目一新的变化. Vue创建者尤雨溪称,Vue 2.0 ...
随机推荐
- mysql数据库my.ini配置文件中文详解
mysql数据库my.ini配置文件中文详解 mysqld程序–目录和文件 basedir = path 使用给定目录作为根目录(安装目录). character-sets-dir = path 给出 ...
- PMP——项目管理的价值观与方法论
关于项目管理的十个成语: 未雨绸缪(计划.风险):识别风险.做出计划.并指定负责人: 防微杜渐(监控.纠正):持续的实时的监控计划,监控和发现偏差,并进行纠正: 资源集成(整合.采购):把最专业的资源 ...
- Docker三剑客之swarm
简介 swarm是一种docker集群管理工具,跟三剑客前两者不同的是:compose是一种统一编排的工具,machine是一种远程控制工具,swarm则是将多个docker主机映射成一个docker ...
- SpringCloud与微服务Ⅲ --- SpringCloud入门概述
一. 什么是SpringCloud SpringCloud基于SpringBoot提供了一套微服务解决方案,包括服务注册与发现,配置中心,全链路监控,服务网关,负载均衡,熔断器等组件,除了基于NetF ...
- 【学习笔记】Linux基础(一):磁盘分区与Linux的安装(以CentOS为例)
一.磁盘分区与Linux的安装(以CentOS为例) 0.说在安装之前 在Linux中,"一切设备皆文件",设备在/dev这个目录下 /dev/sd[a-p] 表示SCSI/SAT ...
- 【学习笔记】Linux基础(二):Linux的基本操作
二.Linux的基本操作 0.正确的开关机操作 开机和登陆: 安全起见,一般不使用最高权限的root账户登入系统,光立系统时再使用 登录时为login程序提供账户名和密码即可,密码不会被显示,登陆后显 ...
- 双括号(()),shell与C++的桥梁
使用语法: ((表达式))用来扩展Shell中的算术运算,以及赋值运算,扩展for,while,if条件测试运算. 注意点: 1.在双括号结构中,所有的表达式可以像c语言一样,如a++,b-- 2.在 ...
- Cobaltstrike指令/beacon命令大全
browserpivot 注入受害者浏览器进程bypassuac 绕过UACcancel 取消正在进行的下载cd 切换目录checkin 强制让被控端回连一次clear 清除beacon内部的任务队列 ...
- abp vnext2.0核心组件之.Net Core默认DI组件切换到AutoFac源码解析
老版Abp对Castle的严重依赖在vnext中已经得到了解决,vnext中DI容器可以任意更换,为了实现这个功能,底层架构相较于老版abp,可以说是进行了高度重构.当然这得益于.Net Core的D ...
- 文件系统(02):基于SpringBoot框架,管理Xml和CSV文件类型
本文源码:GitHub·点这里 || GitEE·点这里 一.文档类型简介 1.XML文档 XML是可扩展标记语言,是一种用于标记电子文件使其具有结构性的标记语言.标记指计算机所能理解的信息符号,通过 ...