当前位置:首页 > 技术文章 > web前端 > Vue.js

  • Vue3组件异步更新和nextTick运行机制源码分析
    Vue3组件异步更新和nextTick运行机制源码分析
    组件的异步更新我们应该都知道或者听说过组件的更新是异步的,对于nextTick我们也知道它是利用promise将传入的回调函数放入微任务队列中,在函数更新完以后执行,那么既然都是异步更新,nextTick是怎么保证回调会在组件更新后执行,其插入队列的时机又是什么时候?带着这些问题我们去源码中寻找答案。先回顾一下组件更新的effect:consteffect=(instance.effect=newReactiveEffect(componentUpdateFn,()=>queueJob(u
    Vue.js . web前端 1482 2023-05-16 10:01:13
  • vue3图片懒加载IntersectionObserver和useIntersectionObserver怎么用
    vue3图片懒加载IntersectionObserver和useIntersectionObserver怎么用
    1、在src下创建helloworld.js内容如下//随便导入一张图片作为加载出错时的默认图片importdefaultImgfrom'@/assets/logo.svg'import{useIntersectionObserver}from"@vueuse/core";//图片加载失败时候用的图片exportdefault{install(app){defineDirective(app)//自定义指令}}//自定义指令constdefin
    Vue.js . web前端 1536 2023-05-15 23:31:04
  • vue3怎么实现微信扫码登录及获取个人信息
    vue3怎么实现微信扫码登录及获取个人信息
    一、流程:微信提供的扫码方式有两种,分别是:跳转二维码扫描页面内嵌式二维码根据文档我们可以知道关于扫码授权的模式整体流程为:1.第三方发起微信授权登录请求,微信用户允许授权第三方应用后,微信会拉起应用或重定向到第三方网站,并且带上授权临时票据code参数;2.通过code参数加上AppID和AppSecret等,通过API换取access_token;3.通过access_token进行接口调用,获取用户基本数据资源或帮助用户实现基本操作。二、前置条件:微信开发官网申请:appid:&l
    Vue.js . web前端 4391 2023-05-15 23:04:04
  • 怎么使用vue3搭建后台系统
    怎么使用vue3搭建后台系统
    首先使用npm或者yarn创建一个vue项目//使用npm创建一个基于vite构建的vue项目npmcreatevite@latest//使用yarn创建一个基于vite构建的vue项目yarncreatevite@latest在创建的构成中选择vuevue-ts创建完之后将项目拖到编译器打开一、配置vite在vite.config.ts文件中配置项目的服务数据,配置如下://此处配置项目服务参数server:{host:"0.0.0.0",//项目运行地址,此处代表loca
    Vue.js . web前端 2387 2023-05-15 22:43:04
  • Vue3之getCurrentInstance与ts怎么结合使用
    Vue3之getCurrentInstance与ts怎么结合使用
    getCurrentInstance与ts结合使用vue3项目中,如果不用ts这样使用是没问题的const{proxy}=getCurrentInstance()在ts中使用会报错:报错:...类型“ComponentInternalInstance|null”我们在项目中一般会用到很多getCurrentInstance()方法,直接封装一下创建useCurrentInstance.ts文件:import{ComponentInternalInstance,getCurrentInstance
    Vue.js . web前端 2606 2023-05-15 22:37:04
  • vue3中的ref与reactive怎么使用
    vue3中的ref与reactive怎么使用
    一、refref是Vue3中的一个函数,它可以将一个普通的变量转化为一个响应式变量。使用ref的时候,我们需要传入一个初始值,ref会返回一个包含了这个初始值的对象。使用ref的语法如下所示:import{ref}from'vue';constcount=ref(0);在上面的代码中,我们创建了一个名为count的变量,它的初始值为0。通过调用ref函数,我们将count变量转化为了一个ref对象。在组件中使用count的时候,我们需要通过.value来访问它的值
    Vue.js . web前端 1848 2023-05-15 22:25:10
  • Vue3怎么获取地址栏参数
    Vue3怎么获取地址栏参数
    Vue3获取地址栏参数有两个方式:查询参数和路径参数。Vue3获取地址栏参数是从路由router中获取,查询参数和路径参数获取方式不一样。一、查询参数比如地址http://127.0.0.1:5173/?code=123123,我们要获取code参数可以路由router获取,注意是route.query首先需要在router/index.js中定义好路由import{createRouter,createWebHistory}from'vue-router'con
    Vue.js . web前端 7107 2023-05-15 22:25:04
  • vue3如何使用el-upload上传文件
    vue3如何使用el-upload上传文件
    el-upload上传文件在项目开发的过程中上传文件的需求是经常会遇到的,这篇文章我们就详细介绍使用elementplus中el-upload来上传文件了。我们先来看一下el-upload可以配置哪些属性和事件。属性action:请求urlheaders:设置上传的请求头部method:设置上传请求方法multiple:是否支持多选文件data:上传时附带的额外参数name:上传的文件字段名with-credentials:支持发送cookie凭证信息以上这些参数都是采用action的默认方式请
    Vue.js . web前端 5339 2023-05-15 21:31:04
  • vue3配置全局参数及组件的使用方法
    vue3配置全局参数及组件的使用方法
    vue2的方式1.全局挂载Vue.property.xxximportVuefrom"vue";importaxiosfrom"axios";Vue.prototype.$http=axios;newVue({router,store,render:(h)=>h(App),}).$mount("#app");2.组件使用this.$http.xxx();vue3的方式1.全局挂载app.config.globalPropertie
    Vue.js . web前端 4159 2023-05-15 18:58:04
  • Vue3中其他的Composition API有哪些
    Vue3中其他的Composition API有哪些
    1.shallowReactive与shallowRefshallowReactive:只处理对象最外层属性的响应式(浅响应式)。shallowRef:只处理基本数据类型的响应式,不进行对象的响应式处理。什么时候使用?如果有一个对象数据,结构比较深,但变化时只是外层属性变化===>shallowReactive。如果有一个对象数据,后续功能不会修改该对象中的属性,而是生新的对象来替换===>shallowRef。2.readonly与shallowReadonlyreadonly:让
    Vue.js . web前端 1607 2023-05-15 17:37:06
  • Vue3+Element-plus项目自动导入报错怎么解决
    Vue3+Element-plus项目自动导入报错怎么解决
    前言在创建Vue3+Element-plus项目时,根据Element-plus文档,采用自动导入,安装unplugin-vue-components和unplugin-auto-import两款插件,但在按要求配置后运行项目,npm报错ERRORSyntaxError:Unexpectedtoken'?'...\node_modules\unimport\dist\chunks\vue-template.cjs:55constname=i.as??i.name;
    Vue.js . web前端 2603 2023-05-15 17:13:10
  • 如何用vue3实现打砖块小游戏
    如何用vue3实现打砖块小游戏
    游戏需求创建一个场景创建一个球,创建一堆被打击方块创建一个可以移动方块并可控制左右移动当球碰撞左右上边界及移动方块回弹挡球碰撞下边界游戏结束完整代码停止游戏开始score:{{scroce}}{{str}}import{onMounted,onUnmounted,reactive,toRefs}from"vue"constboxWidth=500,//场景宽度boxHeight=300,//场景高度ball=10,//小球的宽高moveBottomH=5,//移动方块高度mo
    Vue.js . web前端 1674 2023-05-15 16:22:06
  • vue3使用reactive赋值后页面不改变怎么解决
    vue3使用reactive赋值后页面不改变怎么解决
    场景原因我们需要在vue3中使用服务器的数据渲染到页面上,我使用的是reactive生成的响应式数据属性,但是在挂载后请求的数据并没有渲染显示到页面上。技术:vue3、element-ui-plus一、例子home.vue{{item.authName}}{{item2.authName}}//引入模块import{reactive,onMounted}from'vue'import{useRouter}from'vue-router&#3
    Vue.js . web前端 4107 2023-05-15 14:22:21
  • Vue3响应式系统怎么实现computed
    Vue3响应式系统怎么实现computed
    首先,我们简单回顾一下:响应式系统的核心就是一个WeakMap---Map---Set的数据结构。WeakMap的key是原对象,value是响应式的Map。这样当对象销毁的时候,对应的Map也会销毁。Map的key就是对象的每个属性,value是依赖这个对象属性的effect函数的集合Set。然后用Proxy代理对象的get方法,收集依赖该对象属性的effect函数到对应key的Set中。还要代理对象的set方法,修改对象属性的时候调用所有该key的effect函数。上篇文章我们按照这样的思路
    Vue.js . web前端 1920 2023-05-15 13:13:06
  • laravel怎么安装inertia vue3的版本
    laravel怎么安装inertia vue3的版本
    一、安装前要求1.1已安装laravel框架1.2已安装NodeJS1.3已安装Npm包管理工具二、服务端配置2.1第一步:composer安装inertia-laravel$composerrequireinertiajs/inertia-laravel2.2第二步:laravel目录resouces/views/新增app.blade.php文件,加入以下代码@inertia2.3第三步:执行artisan命令,添加中间件$phpartisaninertia:middleware文件生成后,
    Vue.js . web前端 1384 2023-05-15 10:31:05

PHP讨论组

组员:3305人话题:1500

PHP一种被广泛应用的开放源代码的多用途脚本语言,和其他技术相比,php本身开源免费; 可以将程序嵌入于HTML中去执行, 执行效率比完全生成htmL标记的CGI要高许多,它运行在服务器端,消耗的系统资源相当少,具有跨平台强、效率高的特性,而且php支持几乎所有流行的数据库以及操作系统,最重要的是

学习途径

工具推荐

CSS3聚光灯下倒影文字特效

CSS3聚光灯下倒影文字特效是一款使用CSS3实现的聚光灯下带倒影的文字旋转动画特效。
文字特效
2025-12-17

jQuery企业留言表单联系代码

jQuery企业留言表单联系代码是一款简洁实用的企业留言表单和联系我们介绍页面代码。
表单按钮
2024-02-29

HTML5 MP3音乐盒播放特效

HTML5 MP3音乐盒播放特效是一款基于html5+css3制作可爱的音乐盒表情,点击开关按钮mp3音乐播放器。
播放器特效
2024-02-29

HTML5炫酷粒子动画导航菜单特效

HTML5炫酷粒子动画导航菜单特效是一款导航菜单采用鼠标悬停变色的特效。
菜单导航
2024-02-29

雅龙智能装备工业设备类WordPress主题1.0

一个专为企业网站设计的现代化WordPress主题,集成了多语言支持、自定义SEO、Open Graph、安全加固和完全响应式设计等企业级功能。 ✨ 核心亮点- ? 完整多语言系统 - 支持中文、英文、越南语、葡萄牙语,可扩展- 自定义SEO功能 - 文章、页面、分类独立SEO设置- Open Graph支持 - 完整的社交媒体分享优化- 22项安全加固 - 企业级安全防护,防止脚本小子攻击- 完全响应式 - 完美适配手机、平板、桌面设备- 高性能优化 - 智能缓存、条件加载、代码优化-
企业站源码
2025-12-18

威发卡自动发卡系统

? 威发卡 - 自动发卡系统 (PHP)? 系统概览? 模板说明 自带一套响应式模板
电商源码
2025-12-17

卡密分发系统

一款卡密/授权码/激活码领取系统,前台注册账号登录之后自动进入会员中心可以领取卡密,已限制每个自然月(1号到月末)领取一次,后台可以生成密码,可以导出,用于导入卡密系统或者授权系统 安装环境:PHP7.2(需安装SG11)+SQL 将源码上传到网站根目录,访问域名将进入安装程序
电商源码
2025-12-16

中华陶瓷网

中华陶瓷网V2013版DT5.0内核模板是高仿必途搜索的2012版,系统核心是DestoonV5.0版本,
电商源码
2025-12-16

极简几何风圣诞驯鹿矢量素材

极简几何风圣诞驯鹿矢量素材适用于驯鹿相关设计、圣诞节等相关视觉场景设计的由AI生成的Ai格式素材。
矢量素材
2025-12-18

创意线条早午餐海报设计矢量

创意线条早午餐海报设计矢量适用于早午餐海报等相关视觉场景设计的由AI生成的Ai格式素材。
矢量素材
2025-12-18

咖啡饮品宣传单A5模板素材下载

咖啡饮品宣传单A5模板素材适用于咖啡饮品传单设计 本作品提供咖啡饮品宣传单A5模板素材的图片会员免费下载,格式为PSD,文件大小为47.6M; 请使用软件Photoshop进行编辑,作品中文字及图均可以通过软件修改和编辑;
psd素材
2025-12-18

唯美冬日雪花插画矢量素材

唯美冬日雪花插画矢量素材适用于学花相关设计、冬季主题等相关视觉场景设计的由AI生成的Ai格式素材。
矢量素材
2025-12-18

驾照考试驾校HTML5网站模板

驾照考试驾校HTML5网站模板是一款适合提供驾驶培训和组织驾照考试服务机构宣传网站模板下载。提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢。
前端模板
2025-06-10

驾照培训服务机构宣传网站模板

驾照培训服务机构宣传网站模板是一款适合提供一般驾驶和计划培训的驾校宣传网站模板下载。提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢。
前端模板
2025-01-07

新鲜有机肉类宣传网站模板

新鲜有机肉类宣传网站模板是一款适合提供各种新鲜有机肉类食材宣传网站模板下载。提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢。
前端模板
2025-01-06

HTML5房地产公司宣传网站模板

HTML5房地产公司宣传网站模板是一款适合从事房地产服务行业宣传网站模板下载。提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢。
前端模板
2025-01-06
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号