目录vue引入jquery时报错 $ is not defined安装JQuery统一webpack版本新建配置文件vue错误笔记 Vue is not defined事情的经过找到两种解决方案vue引入jquery时报错 $ is not defined以免日后再次遇到忘记。安装JQuerynpm install --save jquery 统一webp ......
346
0
0
2023-02-08
目录一、axios的封装安装引入环境的切换设置请求超时post请求头的设置请求拦截响应的拦截封装get方法和post方法axios的封装基本就完成了,下面再简单说下api的统一管理。2018.8.14更新我们所要的说的axios的封装和api接口的统一管理,其实主要目的就是在帮助我们简化代码和利于后期的更新维护。一、axios的封装在vue项目中,和后台交互 ......
459
0
0
2023-02-07
目录1. 前言2. 使用Vite搭建官网2.1 创建项目2.1.1. 全局安装vite(这里我装的时候是2.7.2)2.1.2. 构建一个vue模板(项目名可以改成自己的名字)2.1.3. 装好之后按照提示逐步执行命令2.2 基本完成官网的搭建2.2.1. 下载vue-router2.2.2. 创建home首页与doc文档页 以及顶部导航栏2.2.3. 配置 ......
419
0
0
2023-02-06
目录引言1、从new Vue()入口开始:2、this._init3、挂载函数vm.$mount(vm.$options.el)4、mountComponent函数5、_render函数6、createElement函数返回虚拟DOM7、_update函数8、patch函数9、createElm函数10、移除引言一般使用html,css和javascript ......
302
0
0
2023-02-06
目录引言一、发布订阅者模式的特点二、vue中的发布订阅者模式1、dep2、Object.defineProperty3、watcher4、dep.depend5、dep.notify6、订阅者取消订阅小结引言发布订阅者模式是最常见的模式之一,它是一种一对多的对应关系,当一个对象发生变化时会通知依赖他的对象,接受到通知的对象会根据情况执行自己的行为。假设有财经 ......
263
0
0
2023-02-06
目录1.前言2.vue的布局风格2.1vue3需要配合element plus进行布局2.2src下面创建layout文件夹 3.测试效果 4.总结1.前言spa页面的layout布局对于前端项目的影响至关重要,在我们进行web端开发的时候,前端的各种大小屏幕,各种内核的浏览器不同,会导致我们的页面呈现出不一样的效果,如何进行更好的取舍, ......
369
0
0
2023-02-06
目录准备工作第一步 对对象进行劫持第二步 修改取值方法第三步 深度属性劫持准备工作接上文数据初始化完成之后,就可以对数据进行劫持。Vue2中对数据进行劫持采用了一个Api叫Object.defineProperty()在这里需要提供一个方法去观测data变化,这个方法是一个核心模块(响应式模块),我们单独建一个文件夹来存放在/src/observe/inde ......
304
0
0
2023-02-06
目录一、需求描述二、实现思路2.1 正则表达式过滤 img、video等标签2.2 截取固定长度的字符数2.3 考虑小写英文字符和数字宽度问题2.4 注册为全局指令2.5 文本尾部添加【查看全文】或【收起】三、效果一、需求描述文本溢出省略,说实话这些年也实践过很多了,这次是针对富文本字符串,思量想去,也曾试图了解一些知名站点的实现方案,但结果不甚理想。今天记 ......
400
0
0
2023-02-05
目录Swiper为什么要封装组件开始封装1.下载安装Swiper2.引入css样式文件3.引入js文件4.把官网使用方法中的HTML结构复制粘贴过来5.初始化Swiper自定义效果完整代码效果展示SwiperSwiper是一个很常用的用于实现各种滑动效果的插件,PC端和移动端都能很好的适配。官网地址:www.swiper.com.cn/目前最新版本是Swip ......
425
0
0
2023-02-05
目录1.前言2.使用2.1安装2.2基本用例2.2.1 get请求2.2.2post请求3.配置3.1语法3.2别名4.Axios实例4.1语法4.2请求配置4.3响应的配置配置的优先级5.拦截器6.错误拦截7.取消请求8.完整封装 建立http.ts文件编写clas Http类9.总结1.前言最近在写vue3的项目,需要重新搭建脚手架并且使用网络请求接口, ......
719
0
0
2023-02-05
目录vue让局域网ip访问配置设置vue局域网使用ip无法访问的解决vue让局域网ip访问配置设置在开发中,为了让同一局域网的小伙伴,都可以通过IP地址访问到vue-cli搭建的项目,要怎么配置呢?第一步:修改config文件中找到 index.js 文件的host改成 ‘0.0.0.0’第二步:检查 package.json 文件里进行 ......
547
0
0
2023-02-04
目录前言Form表单的封装简述正常的使用开始封装①开始封装②开始封装③开始封装④完整封装代码⑤配置项类型文件配置项文件form表单组件文件page-search组件文件role页面组件文件结语Table表格的封装简述正常使用开始封装①开始封装②开始封装③完整封装代码④配置项类型文件配置项文件table表单组件文件page-table组件文件user页面组件文 ......
553
0
0
2023-02-04
目录select组件绑定的值为数字类型问题vue中的绑定值学习重点select组件绑定的值为数字类型问题在日常开发中,我们双向绑定的form表单,经常会遇到对数字类型的绑定,但对于v-model 绑定的值,输入数字会自动转成字符串类型。对于input输入框绑定的值,想要修改为数字类型很简单,只需要使用表单的修饰符就可以。如下所示number 可以将绑定的 v ......
423
0
0
2023-02-03
目录简单Diff算法减少DOM操作例子结论实现DOM复用与key的作用例子虚拟节点的key实现找到需要移动的元素探索节点顺序关系实现如何移动元素例子实现添加新元素例子实现移除不存在的元素例子实现总结简单Diff算法核心Diff只关心新旧虚拟节点都存在一组子节点的情况减少DOM操作例子// 旧节点 const oldVNode = { type: 'd ......
365
0
0
2023-02-03
目录前言一、vue实例方法和实例数据 1、vm.$set2、vm.$delete3、vm.$watch二、实例方法和事件1、vm.$on2、vm.$emit3、vm.$once4、vm.$off三、实例方法和生命周期1、vm.$mount2、vm.$destroy3、vm.$nextTick总结前言在了解vue的常用的实例方法之前,我们应该先要了解 ......
302
0
0
2023-02-03