项目场景：后台接口请求数据，返回PDF文档的链接（即pdf文件在服务器上的存放路径），在vue3页面可预览和打印该PDF。在之前的Vue2项目中，预览并打印PDF用的是vue-pdf这个插件，但在vue3中是不支持的，只能换个插件了，于是经过测试，也踩了一些坑，总结了以下两种方法：方法一：使用vue-pdf-embed + pdfjs-dist①首先，安装这两个插件依赖pnpm
vue3 core之生命周期 引入篇1 文章简介2 生命周期主要内容2.1 引出生命周期2.1.1 例子引入2.1.1.1 不推荐的实现方法（定时器在vue外面）2.1.1.2 推荐使用的实现方式（定时器在vue里面）2.1.2 vue实例的执行过程2.1.3 挂载概念的引入2.1.4 生命周期函数2.1.4.1 生命周期回调函数2.1.4.2 生命周期钩子（程序员内常用语言）2.1.5 生命钩
# 利用 Axios 在 Vue 3 中进行 HTTP 请求
在现代web开发中，前端框架和库层出不穷，而 Vue.js 作为热门的前端框架之一，在开发中常常需要与后端进行数据交互。Axios 作为一个简易的 HTTP 客户端库，能够让这种交互变得更加顺畅且方便。本文将为大家介绍如何在 Vue 3 中引用和使用 Axios，配合实际代码示例来帮助你理解。
## Axios简介
Axios 是
初始化项目脚手架用的是vue-cli,vite还不太稳定，很多第三方库也存在兼容问题，为了能正常在实际项目中使用，还是选择了vue-cli。如果不是最新的脚手架，就需要重新安装一下了：npm install -g @vue/cli
# OR
yarn global add @vue/cli创建项目：vue create vue3-ts-template
// 选择Manually select
需求：下拉菜单中数据过多，200条以上，就会导致Ant design Vue 中的select组件卡死。所以需要使用滑动到底部使其分页加载 可以借助 onPopupScroll 事件来监听下拉菜单的滚动事件，并判断当前是否已经到达了下拉菜单底部。具体可以通过以下步骤实现： 1、在组件中绑定 @popupScr
antdesign-vue结合sortablejs实现两个table相互拖拽排序实现效果sortablejs介绍具体实现 实现效果本来想在网上看看有没有基于antdesign做的，然后发现是真的少啊！废话不多说，先上图：sortablejs介绍首先先来认识一下这个插件: sortablejs 大家可以去细读一下它的api文档： 这边我就着重介绍一下我用到的api。 1.group可以传入对象，参
作者：前端阿飞要说今年最热门的前端技术，Vue3 和 TS 绝对榜上有名了。据了解，已经有很多公司在使用 Vue3 + TS + Vite 开发新项目了。那么我们也不能落后，今天就给大家分享一下如何在 Vue3 组件中结合 Composition-Api 使用 TS 类型。如果有不会或者不熟的小伙伴，一起学起来吧！为 props 标注类型使用 <script setup>
当使用 &l
1.啰唆两句1）、工作中，我们会发现有些前端操作是经常会用到的，我们就拿Table表格的添加和修改举例子，如果用到一次写一次,那我们的代码就太臃肿了； 2）、我们可以把这些可以复用的功能抽成一个组件来循环使用，哪里需要用到就只需要去调用就行了。 3）、重点是学思路，学方法。2.直接上图1）、这是需要做的样式界面。2）、这是添加界面3）、这是修改界面4）、思路分析 其实添加数据跟修改数据的界面都是一
封装一个指令，简单粗暴，不需要在input上加上一大堆的方法或正则那么麻烦。1.创建一个js文件，用来注入Vue全局指令// 移入Vue
import Vue from 'vue';
// 通过Vue的指令方法，定义指令名称
Vue.directive('Int', {
// bind绑定 获取当前目标的input（就是在哪个文本框上使用指令）
bind: function(el)
一、前言 利用Sass预处理实现换肤和字体大小调整。 思路及达到的效果：字体大小的适配使用window.devicePixelRatio的值和需要调整的差量进行控制。页面初始化是的字体适配可以根据devicePixelRatio和css3 media进行适配. 实现方法：1.利用全局变量和bus事件，使用js方式调整字体和颜色(这里暂不讨论); 2.利用scss预处理方式实现
首先登陆阿里云矢量图标库[http://www.iconfont.cn/home/index]，把需要的字体图标加入到自己的项目中 将项目下载到...
原创
2022-08-09 15:05:58
406阅读
首先登陆阿里云矢量图标库，把需要的字体图标加入到自己的项目中将项目下载到本地，并解压到项目中在项目中引入： main.ts: import './assets/iconfont/iconfont.css'; 组件中使用：
原创
2022-09-02 09:55:14
386阅读
# Vue3 引入 Axios 实践指南
作为一名刚入行的开发者，你可能对如何在 Vue3 中引入和使用 Axios 感到困惑。别担心，本文将为你提供一份详细的指南，帮助你快速上手。
## 步骤概览
首先，我们通过一个表格来概览整个引入过程：
| 步骤 | 描述 | 操作 |
| --- | --- | --- |
| 1 | 安装 Axios | 使用 npm 或 yarn 安装 Axi
相信大家对于下面的列表形式应该不陌生吧，至少我个人在后台OA系统的时候就用到了，那么我来聊下这样形式的列表，应该怎么封装成为一个公共的组件。（代码参考了iview用于个人学习之用）一.列表组件参数设置 每一个公共组件都应该约定好参数，定义好回调函数所传递参数。不应该与业务组件和业务逻辑相互耦合。 这个组件的约定参数和使用方法如下：<Collapse v-model="value1" @on-
2.Promise的thenthen 方法 一定会 返回一个 新的 Promise 对象如果 then 中的 回调函数 return 了一个 Promise对象，则 返回这个 对象如果 then 中的 回调函数 return 了一个 非Promise对象数据，则 自动创建新Promise对象，并将数据传入let p1 = new Promise(function (resolve, reject)
# Python3引用实现流程
本文将介绍如何在Python3中实现引用的功能，并指导刚入行的小白完成这项任务。首先，让我们来了解整个实现流程。
## 实现流程
下面是实现Python3引用的流程图：
```mermaid
flowchart TD
A(创建对象) --> B(创建引用)
B --> C(引用对象)
```
## 代码实现
### 创建对象
首先，我们
安装axios npm install axios -S main.js 配置 import axios from 'axios' //基础配置 axios.defaults.baseURL = "https://localhost:44324/"; const app = createApp(Ap ...
转载
2021-09-02 15:47:00
1427阅读
2评论
vue2项目升级到vue3本地环境升级，npm\node\vue-cli根据官方package.json 依赖包进行调整和升级（把依赖库全部删除，调整package.json文件内容，重新下载依赖库，运行后解决报错）内容适配（main.js修改 element\echart 版本不同，引入方法不同）跑项目，挨个解决错误element-ui升级到element-plus1、s
VUE+springboot项目开发总结一、前端VUE（Ant Design Vue Pro）1，table隔行换色2，改变table行高3，vs-code setting.json默认配置和代码自动格式化配置5，全局共通函数定义6，使用filter7，CSS8，跳转路由--带参数的跳转三种方式9，自定义校验10，在光标处插入文本内容11，model开发12，form表单元素，一行包含多个控件，
1.v-once标签，我们知道vue是响应式的，即某个地方数据更改了，界面的数据也会更改，有时候我们只希望界面只渲染一次，不希望界面的数据乱变动，那么就可以使用v-once标签了<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tit
