weixin_46435234的博客

vue中数据代理的好处：更加方便地操作data中的数据 Object.definedProperty(vm,"name",{ get(){ return vm._data.name } set(newValue){ vm._data.name=newValue } })

Vue3快速上手 1.Vue3简介 2020年9月18日，Vue.js发布3.0版本，代号：One Piece（海贼王） 耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者 github上的tags地址：https://github.com/vuejs/vue-next/releases/tag/v3.0.0 2.Vue3带来了什么 1.性能的提升 打包大小减少41% 初次渲染快55%, 更新渲染快133% 内存减少54% … 2.源码的升级 使用Proxy

const path = require("path") const resolve = dir => path.resolve(__dirname, dir) module.exports = { webpack: { alias: { "@": resolve("src"), "components": resolve("src/components") } } }

# Vue集成第三方动画库 animate.css官网链接：https://animate.style/ 安装： npm install animate.css --save 在项目种引入 import "animate.css" 使用animate.css 给transition标签添加上固定的name属性 按需求添加上 enter-active-class="官网上自己找动画值" =》进入动画的过程 leave-acitve-

# Vue动画 想要给谁加动画效果，就给谁包裹transition标签 transition默认会动态给被包裹元素添class样式： v-enter：元素显示/插入前的效果，元素初始的位置 例如：transform: translateX(-200%); v-active-enter：元素显示/插入的过渡时间和函数，初始前到最终的一个时间段 例如：transition: all 0.3s ease; v-enter-to：元素显示/插入后的效果，元素最终的位置 .

# 全局事件总线:可以实现任意组件间的通信 可以设置为全局事件总线的对象需要满足： 1、能使全局所有的组件都能够访问的到 2、这个对象具有$emit() $on() $off() 方法 满足这个两个要求的只有是Vue对象 全局事件组件可以实现任意两个组件之间进行数据的交互 创建全局实例对象：方式1 在main.js中 import Vue from "vue" Vue.prototype.$EventBus=new Vue() 创建

消息订阅与发布 也可以实现任意组件间的通信 1.订阅消息：设置消息名 --》需要数据的组件进行订阅消息 2.发布消息：传递消息内容 --》传递数据的组件进行发布消息 npm i pubsub-js --> 消息订阅与发布所需库 使用步骤 1.npm i pubsub-js -S 2.在需要使用消息订阅与发布的地方使用 订阅消息的组件（接收数据的组件） import pubsub from "pubsub-js" mo

监听的属性发生改变就会执行回调函数 注意：Vue所管理的函数，都不能写成箭头函数， Vue管理的函数：methods中定义的函数，计算属性，监听器中的函数 事件修饰符 vue中的事件修饰符： 1.prevent：阻止默认事件（常用）；原生阻止默认行为：event事件对象.preventDefault() 2.stop：阻止事件冒泡（常用）；原生阻止冒泡：event事件对象.stopPropagation() 3.once：事件只触发一次（常用）之后就不会触发绑定的事件函数； 4.capture：使用

Vue中一个重要的内置关系：VueComponent.prototype.__proto__===Vue.prototype 这个内置关系使得：让组件实例对象（vc）可以访问到Vue原型上的属性和方法

我们学过的指令： v-bind : 单向绑定解析表达式, 可简写为 :xxx v-model : 双向数据绑定 v-for : 遍历数组/对象/字符串 v-on : 绑定事件监听, 可简写为@ v-if : 条件渲染（动态控制节点是否存存在） v-else : 条件渲染（动态控制节点是否存存在） v-show : 条件渲染 (动态控制节点是否展示) v-text指令： 1.作用：向其所在的节点中渲染文本内容。 2.与插值..

Vue数组中响应式的方法： push() 在数组最后元素中追加元素 pop() 删除数组最后一个元素 shift() 删除数组中第一个元素 unshift() 在数组前面元素中追加元素 splice() 删除、插入、替换元素 sort() 排序 reverse() 反转 Vue中的响应式原理 vue响应式依赖的两种核心技术： 1.Vue中修改数据，Vue内部是如何监听message数据的变化的 Object.defineProperty()

资源链接：https://download.csdn.net/download/weixin_46435234/20429610 此链接为博客资源链接，请放心购买，（整理资源不易，就当请小弟一杯奶茶啦） 资源目录：

资源链接：https://download.csdn.net/download/weixin_46435234/20429610 此链接为博客资源链接，请放心购买 资源目录：

首页 详情页 确定订单页 添加收货地址 订单备注页 在线支付页 确认订单页 订单详情页 我的页 我的收货地址页

最好安装一下nodenmon 这个来启动node环境 pip install nodemon // node监听本地文件发生变化，重新启动服务 async function kill(child, callback) { if (process.platform === "win32") { const _child = execa('taskkill /pid ' + child.pid + ' /T /F', [], { shell: true, cwd

分析: 此题考查Vuex的应用及 Vue内部的监听数据变化的机制 解答: 首先确定 Vuex是为了解决什么问题而出现的 ? Vuex是为了解决组件间状态共享而出现的一个框架. 其中有几个要素 是组成Vuex的关键, state(状态) mutations actions , state 表示 需要共享的状态数据 mutations 表示 更改 state的方法集合 只能是同步更新 不能写ajax等异步请求 actions 如果需要做异步请求 ...

文章目录 better-scroll介绍better-scroll 是什么起步滚动原理better-scroll 在 MVVM 框架的应用 安装NPMscript 加载 选项 / 基础startXstartYscrollXscrollYfreeScrolldirectionLockThresholdeventPassthroughclickdblclick(v1.12.0+)tapbouncebounceTimemomentummomentumLimitTimemomentumLimitDi...

Bettor-Scroll.vue组件 <template> <!-- wrapper必须要有高度 --> <div class="wrapper"> <!-- 当 content 的高度不超过父容器的高度，是不能滚动的 --> <div class="content"> <!-- 滚动内容 --> <slot></slot> </div&gt..

经典面试题: 1). react/vue中的key有什么作用？（key的内部原理是什么？） 2). 为什么遍历列表时，key最好不要用index? 1. 虚拟DOM中key的作用： 1). 简单的说: key是虚拟DOM对象的标识, 在更新显示时key起着极其重要的作用。 2). 提升渲染性能 2). 详细的说: 当状态中的数据发生变化时，react会根据【新数据.

图片懒加载： 懒加载：用到时再加载，图片显示再视口上，再进行加载 npm i vue-lazyload -S 在main.js中使用 import VueLazyLoad from "vue-lazyload" Vue.use(VueLazyLoad,{ 图片没有加载出来的时候用那张图片代替 loading:import("路径")//在js中导入静态文件 }) 使用 <img v-lazy="地址" /> ...

轮播图 组件封装思路： 所以会封装两个组件 1.swiper 2.swiperItem swiperitem组件： <template> <div class="slide"> <!-- 组件插槽给图片站的位置 --> <slot></slot> </div> </template> <script> export default { name: "Sl