Vue
文章平均质量分 76
平平无奇前端练习生
一个刚自学前端的菜鸟,每天记录笔记,一起进步!!!
展开
-
一篇文章解决vue生命周期
Vue生命周期 Vue 实例从创建到销毁的过程,就是生命周期。 从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、销毁等一系列过程,称之为 Vue 的生命周期。(在以下流程中,生命钩子函数用加粗表示) 挂载流程 初始化生命周期、事件,但数据代理为开始; beforeCreate:此时无法通过vm访问到data中的数据以及methods中的方法; 初始化数据监测、数据代理; created:此时可以通过vm访问到data中的数据,methods中的方法; Vue开始解析模板,生原创 2021-11-03 11:58:33 · 288 阅读 · 0 评论 -
详解Vue2基本语法第五弹
全局事件总线 1、一种组件间通信的方式,适用于任意组件间通信 2、安装全局事件总线: new Vue({ ... beforeCreate(){ Vue.prototype.$bus = this//安装事件总线,$bus就是当前应用的vm } }) 3、使用事件总线: (1)接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的回调留在A组件自身 methods(){ demo(data){} ... mounted(){原创 2021-10-28 10:30:15 · 182 阅读 · 0 评论 -
详解Vue2基本语法第四弹
ref属性 1、被用来给元素或子组件注册引用信息 2、应用在html标签上获取的是真实的DOM元素,应用在组件标签上是组件实例对象(vc) 3、使用方式: (1)打标识: <h1 ref="xxx"></h1>或<school ref="xxx"></school> (2)获取:this.$refs.xxx props配置项 1、功能:让组件接收外部传进来的数据 2、传递数据:<Demo name="xxx"> 3、接收数据原创 2021-10-28 10:14:14 · 174 阅读 · 0 评论 -
详解Vue2基本语法第三弹
事件处理 事件的基本使用 1、使用v-on:xxx或@xxx绑定事件,其中xxx是事件名 2、事件的回调需要配置在methods对象中,最终会在vm上 3、methods中配置的函数不要使用箭头函数,否则this就不是vm了 4、methods中配置的函数,都是被vue管理的函数,this的指向是vm或组件实例对象 5、@click="demo"和@click="demo($event)"效果一致,但后者可以传参 事件修饰符 1、prevent:阻止默认事件 2、stop:阻止事件冒泡事件原创 2021-10-25 19:28:49 · 198 阅读 · 0 评论 -
详解Vue2基本语法第二弹
绑定样式 1、Class样式 写法 :class="xxx",xxx可以是字符串、对象、数组 2、style样式 :style="{fontSize:xxx}",其中xxx是动态值 :style="[a,b]",其中a,b是样式对象 条件渲染 1、v-if 写法 (1)v-if="表达式" (2)v-else-if="表达式" (3)v-else="表达式" 适用于:切换频率较低的场景 特点:不展示的DOM元素直接被移除 注意:v-if与v-else-if可以原创 2021-10-25 19:20:21 · 364 阅读 · 0 评论