weixin_45213764的博客

过滤器 什么是过滤器？ 用来格式化数据的一个函数 vue 1.x 版本:借鉴了 angular , 提供 10 个过滤器， 包括有： 日期 小数点位数保留 货币 大小写 等 Vue 2.x 版本：废弃了这 10个过滤器，但是它提供了自定义过滤器的方式 使用方式 全局定义过滤器 <p> {{ time | timeFilter('/)}} </p> ...

生命周期 什么是生命周期？ vue中的生命周期指的是 组件 从创建到销毁一个过程，在这个过程中，我们在每一个特定的阶段会触发一些方法（ 这些方法具备一些功能），我们给这些方法起了个名字叫做（ 生命周期钩子函数/ 组件钩子 ） 为什么要学习生命周期？ 因为我们想在生命周期钩子中实现项目功能，那么我们必须知道每一个钩子函数的具体用途 这个生命周期是谁的生命周期？ 组件 项目中生命周期...

swiper 作用： 用来实现移动端，pc端滑动操作 swiper是一个第三方的库 学习 swiper 官网文档 https://www.swiper.com.cn/ vue中swiper实现 1. 静态数据的第三方库实例化，我们写在mounted中 2. 动态数据的第三方库实例化，我们写在updated中 3. 优化： 1. 做判断条件 2. 异步队列 ...

三、自定义指令 v-html v-text v-for v-if v-else-if v-else v-show v-on v-bind v-model 以上指令可以不够用户使用，所以vue给开发者提供了自定义指令的方式 举例： 比如说 我想要有一个指令，来实现一个自动获得input焦点，或是一个轮播 。。。 有两种自定义指令的使用形式： 全局定义 ---- vue.direc...

过渡效果 && 动画 官方文档： https://cn.vuejs.org/v2/guide/transitions.html 使用形式 在 CSS 过渡和动画中自动应用 class Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/离开过渡 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 组件根节点 ...

Vue事件驱动原理 数据驱动 当数据发生改变时，视图也会进行更新，这叫做数据驱动，也就是数据驱动视图 深入响应式原理 数据模型仅仅是普通的 JavaScript 对象。而当你修改它们时，视图会进行更新 双向数据绑定原理 当我们使用 v-model 指令绑定了表单元素时，那么我们可以在视图直接获得数据，当视图发生改变时，数据也会进行更新 综上： 三者都是应用了同一个底层原理，这个底层原理由es5...

Vue有两大特性 指令 – 用来操作dom 组件 – 组件是html css js 等的一个聚合体 为什么要使用组件？ 组件化 将一个具备完整功能的项目的一部分进行多处使用 加快项目的进度 可以进行项目的复用 要想实现组件化，那么我们使用的这一部分就必须是完整的，我们把这个完整的整体就称之为组件 当我们使用插件时需要引入： index.html img c...

app实例的手动挂载 new Vue({ }).$mount('#app')

组建通信 为什么要进行组件通信 组件可以所示一个具有独立功能的整体，但是当我们要将这些组件拼接在一起时，这些组件相互之间要建立联系，这个联系我们就称之为通信 组件通信的方式有以下几种 父子组件通信 使用props来实现 props 在父组件的模板中将数据用单项数据绑定的形式，绑定在子组件身上 <Son :money = "money"/> 在子组件的配置...

slot 作用域插槽 作用/概念: 预先将将来要使用的内容进行保留 具名插槽： 给slot起个名字 注意： 以上两种形式在 vue2.6以上被废弃 为什么要 用 v-slot指令来代替呢？ 经具名插槽和作用域插槽进行统一 要将这两个属性带有 vue的标志，并且符合vue两个最大的特性之一： 指令的概念 要求： 2.6版本前的会，2.6版本后的v-slot也得会 旧： s...

属性验证 案例： 价格的增加 ， 拿到的数据必须做验证 props: [ ‘msg’ ] 没有进行验证，知识单纯的接收了一个父组件传递来的数据 props: { attr: attrType } 进行普通属性验证 props: { type: typeType, default: value } 这里的default是为这个属性设置初始值 props: { validator ( val...

cli 什么是cli? cli是vue提供的一个用来快速构建项目环境的一个工具，底层使用的是webpack cli目前有哪些版本？ cli2 cli3 cli3对电脑的配置有一定要求 cli如何使用？ cli的安装 npm/cnpm/yarn 都可以使用 $ yarn add @vue/cli global 这个是cli3的版本 如果我们还想使用cli2的脚手架，那么我...