草庐IT

Vue-Instant

全部标签

vue3项目实战中的接口调用方法(二)fetch用法 (前后端交互) get请求/post请求/put请求/delete请求

vue3项目实战fetch调用接口🔥一文搞定🔥点击进入vue专栏🔥fetch概述fetch基本用法fetch的HTTP请求🔥🔥get请求🔥delete请求post请求🔥put请求方式🔥fetch响应结果/格式summary🔥点击进入vue专栏🔥上期推文中讲述了vue3项目实战中接口调用的方法(一)🔥点击即可复习🔥,介绍了async/await调用接口的过程和方法。从本期文章开始将会不定时更新vue3项目实战中接口调用的三大方法。👏👏👏本期文章将重点介绍vue3的fetch方法实现请求接口。(👏👏👏欢迎大佬们多多指教!)fetch概述基本特性fetch是传统ajax的升级版本,并不是对ajax的

vue3探索——pinia高阶使用

以下是一些Pinia的其他高阶功能:storeToRefs():响应式解构仓库,保证解构出来的数据是响应式的数据。状态持久化:Pinia并没有内置的状态持久化功能,但你可以使用第三方库或自定义插件来实现状态的持久化。例如,你可以使用 localStorage 或 sessionStorage 来将状态保存在客户端。插件系统:Pinia允许你编写自定义插件,以扩展和定制状态管理功能。你可以创建插件来处理持久化、日志记录、错误处理等任务,以适应你的特定需求。响应式解构storeToRefs()背景在组件中访问仓库state,getters,actions时,总要在变量名前面带上仓库实例名,像下面这

Vue 高德地图(@amap/amap-jsapi-loader)的基本使用:添加标记、POI关键字搜索、路线规划...(方法一)

高德地图的基本事件与使用前言:引入并初始化渲染地图1、初始化地图2、地图鼠标点击事件3、添加标记、移除标记点4、搜索服务——POI关键字搜索[AMap.PlaceSearch]5、驾车路线规划服务5.1可拖拽驾车路线规划[AMap.DragRoute]5.2途经点(起点终点途经点)路线规划[AMap.Driving]5.3位置经纬度+获取驾车规划数据[AMap.Driving]5.4规划结果+驾车路线绘制[AMap.Driving]完整代码:前言:引入并初始化渲染地图具体的步骤可以参考我的上一篇博客,有详细说明如何注册申请高德的Key、秘钥,初始化地图等等vue-amap:vue-amap基于

vue数据更新了,但是页面不渲染的问题

写项目的时候发现了一个bug,就是点编辑的时候,需要选择一个弹框里的数据,选择好后data里的数据更新了,但是页面没有更新。如果先新增一次的话,再点编辑就可以更新。自己最后实在不知道怎么解决了,就百度了一下,看到了这篇文章⬇----------------------------------------------------------------------------------------------------------------------------第一种情况:就是在初始化的时候没有这个属性,是动态添加的属性。这个时候不会引起vue自动渲染机制。this.$set(objec

vue配置开发环境和生产环境

介绍本文主要介绍开发、测试以及生产环境的配置。(以下内容可根据需求进行配置)步骤1、在src同级目录也就是根目录下新建文件:.env.development(开发环境)、.env.test(测试环境)、.env.production文件(生产环境)2、三个配置文件的配置内容:2.1 .env.development(开发环境)配置内容NODE_ENV='development'//模式VUE_APP_MODE='development'//通过"VUE_APP_MODE"变量来区分环境VUE_APP_API_URL='http://***.****:8008/api/'//api地址2.2 .

vue2+element UI,根据组织选择人员弹窗的封装!(组织为树结构)

弹窗截图 弹窗功能代码:组织架构{{data.name}}人员{{item.name}}({{item.personStatus}})人员{{item.name}}({{item.personStatus}})删除确定取消/*组织结构下人员选择的弹框*/import{getListData}from'@/utils/utils';import{mapGetters}from'vuex';exportdefault{props:{dialogCopyVisible:{type:Boolean,default:false,},/***params:{*title:弹框标题*isMultiple:是

[Vue]ref属性

前言系列文章目录:[Vue]目录老师的课件笔记,不含视频https://www.aliyundrive.com/s/B8sDe5u56BU笔记在线版:https://note.youdao.com/s/5vP46EPC视频:尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通文章目录前言1.ref属性1.1ref属性的使用方式1.1.1标识元素或子组件1.1.2获取标识的元素或子组件1.2使用ref属性标记html标签元素1.3使用ref属性标记子组件1.4使用id获取元素或子组件1.ref属性ref属性被用来给元素或子组件注册引用信息(id的替代者),相当于对页面元素或子组件标识

vue2.0运行导入的项目出现node:events:491 throw er; // Unhandled ‘error‘ event错误提示解决办法

只为记录自己遇到的错误。 错误提示:Apprunningat: -Local: http://localhost:8080/ -Network:unavailable Notethatthedevelopmentbuildisnotoptimized. Tocreateaproductionbuild,runnpmrunbuild.node:events:491   thrower;//Unhandled'error'event   ^在尝试过关闭占用端口后还是无法解决,最后找到vue.config.js文件中 将open中的true改为false即可正常运行至于端口号我这边是指定为8080的

vue项目中使用m3u8格式播放大视频

一、背景网站中播放大视频时经常卡顿,无法顺利播放,在查找解决方案时发现很多文章建议使用m3u8流媒体播放代替MP4播放,做了下测试,现总结记录下测试过程中遇到的问题与解决办法。二、测试实现1.使用ffmpeg做视频转换1)下载ffmpeg FFmpeggithub2)在环境变量path中加入配置,以便在控制台使用指令3)使用指令将MP4格式视频转为m3u8格式ffmpeg.exe-ivideo.mp4-hls_time60-hls_list_size0-fhlsa.m3u8上述指令中-ivideo.mp4表示输入视频源为video.MP4(此处已用指令打开视频所目录),-hls_time60表

spring boot 配合element ui vue实现表格的批量删除(前后端详细教学,简单易懂,有手就行)

目录一.前言:二.前端代码:2.1.elementui组件代码 2.2删除按钮2.3.data2.4.methods三.后端代码:一.前言:研究了其他人的博客,找到了一篇有含金量的,进行了部分改写实现前后端分离,参考博主为小白Rachel先看看页面效果,要是符合你们所需的功能那就继续看下去    14061407被干掉了 二.前端代码:2.1.elementui组件代码想要实现勾选框那么就需要加上 加入事件。该事件可用于获取勾选到的那一行数据的id,如果勾选多行数据,那么就会将id打包成数组,我们就可以将数组传给后端,然后由Java程序员(还是我)进行接收,进行批量删除。@selection-