vue框架基础学习

时间：2020-07-12 14:06:55 阅读：54 评论：0 收藏：0 [点我收藏+]

一、
1、el:元素挂载的地方
data:数据模型
二、模板语法概述
1、差值表达式
2、指令
1、什么是自定义属性
2、指令本身就是属性
3、指令的格式如 v-clock
4、数据绑定指令
v-text 填充文本比差值表达式简洁
v-pre：显示原始信息，跳过编译
5、数据响应式
（1）、如何理解数据响应式
html5响应式根据屏幕尺寸的变化而变化
数据响应式：数据的变化导致页面的变化
（2）、什么是数据绑定，将数据绑定在标签中
（3）、v-once 绑定一次
3、事件绑定
v-on指令用法
<input type="boutton" v-on:click="num++">
简易<input type="bouttn" @click="num++">
参数传递如果直接绑定函数名，默认传递事件
如果事件绑定函数调用，那么事件对象必须是最后一个参数
事件修饰符
stop阻止冒泡
<a v-on:click.stop = "handle"></a>
prevent
<a v-on:click.prevent = "handle"></a>
按键修饰符
enter <input v-on:key.enter=‘submit>
delte <input v-on:key.enter=‘delete‘>
自定义修饰符
全局config.keCodes对象
Vue.config.keyCodes.f1 = 122
4、属性绑定
v-bind
<a v-bind:href="url">
简写<a :href="url">
5、样式绑定
对象
<div v-bind:class={"active:isActive"}></div>
数组
<div v-bind:class=["activeRerror","error"]>
6、分支循环
v-if / v-else /v-else-if
v-show 原理就是控制i元素的样式是否显示 display:none

基础步骤：
1、实例静态UI效果
2、基于数据重构UI

常用特性
1、表单操作
2、自定义指令
3、计算属性偏差
4、过滤器
5、监听器
6、生命周期

vue框架基础学习

标签：监听器信息 submit 全局 bind lse 数据对象 isp

原文地址：https://blog.51cto.com/14582569/2510146

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行