-
- Vue3组件异步更新和nextTick运行机制源码分析
- 组件的异步更新我们应该都知道或者听说过组件的更新是异步的,对于nextTick我们也知道它是利用promise将传入的回调函数放入微任务队列中,在函数更新完以后执行,那么既然都是异步更新,nextTick是怎么保证回调会在组件更新后执行,其插入队列的时机又是什么时候?带着这些问题我们去源码中寻找答案。先回顾一下组件更新的effect:consteffect=(instance.effect=newReactiveEffect(componentUpdateFn,()=>queueJob(u
- Vue.js . web前端 1473 2023-05-16 10:01:13
-
- 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前端 1529 2023-05-15 23:31:04
-
- vue3怎么实现微信扫码登录及获取个人信息
- 一、流程:微信提供的扫码方式有两种,分别是:跳转二维码扫描页面内嵌式二维码根据文档我们可以知道关于扫码授权的模式整体流程为:1.第三方发起微信授权登录请求,微信用户允许授权第三方应用后,微信会拉起应用或重定向到第三方网站,并且带上授权临时票据code参数;2.通过code参数加上AppID和AppSecret等,通过API换取access_token;3.通过access_token进行接口调用,获取用户基本数据资源或帮助用户实现基本操作。二、前置条件:微信开发官网申请:appid:&l
- Vue.js . web前端 4383 2023-05-15 23:04:04
-
- 怎么使用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前端 2379 2023-05-15 22:43:04
-
- Vue3之getCurrentInstance与ts怎么结合使用
- getCurrentInstance与ts结合使用vue3项目中,如果不用ts这样使用是没问题的const{proxy}=getCurrentInstance()在ts中使用会报错:报错:...类型“ComponentInternalInstance|null”我们在项目中一般会用到很多getCurrentInstance()方法,直接封装一下创建useCurrentInstance.ts文件:import{ComponentInternalInstance,getCurrentInstance
- Vue.js . web前端 2599 2023-05-15 22:37:04
-
- 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前端 1841 2023-05-15 22:25:10
-
- 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前端 7095 2023-05-15 22:25:04
-
- vue3如何使用el-upload上传文件
- el-upload上传文件在项目开发的过程中上传文件的需求是经常会遇到的,这篇文章我们就详细介绍使用elementplus中el-upload来上传文件了。我们先来看一下el-upload可以配置哪些属性和事件。属性action:请求urlheaders:设置上传的请求头部method:设置上传请求方法multiple:是否支持多选文件data:上传时附带的额外参数name:上传的文件字段名with-credentials:支持发送cookie凭证信息以上这些参数都是采用action的默认方式请
- Vue.js . web前端 5327 2023-05-15 21:31:04
-
- 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前端 4150 2023-05-15 18:58:04
-
- Vue3中其他的Composition API有哪些
- 1.shallowReactive与shallowRefshallowReactive:只处理对象最外层属性的响应式(浅响应式)。shallowRef:只处理基本数据类型的响应式,不进行对象的响应式处理。什么时候使用?如果有一个对象数据,结构比较深,但变化时只是外层属性变化===>shallowReactive。如果有一个对象数据,后续功能不会修改该对象中的属性,而是生新的对象来替换===>shallowRef。2.readonly与shallowReadonlyreadonly:让
- Vue.js . web前端 1599 2023-05-15 17:37:06
-
- 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前端 2597 2023-05-15 17:13:10
-
- 如何用vue3实现打砖块小游戏
- 游戏需求创建一个场景创建一个球,创建一堆被打击方块创建一个可以移动方块并可控制左右移动当球碰撞左右上边界及移动方块回弹挡球碰撞下边界游戏结束完整代码停止游戏开始score:{{scroce}}{{str}}import{onMounted,onUnmounted,reactive,toRefs}from"vue"constboxWidth=500,//场景宽度boxHeight=300,//场景高度ball=10,//小球的宽高moveBottomH=5,//移动方块高度mo
- Vue.js . web前端 1670 2023-05-15 16:22:06
-
- vue3使用reactive赋值后页面不改变怎么解决
- 场景原因我们需要在vue3中使用服务器的数据渲染到页面上,我使用的是reactive生成的响应式数据属性,但是在挂载后请求的数据并没有渲染显示到页面上。技术:vue3、element-ui-plus一、例子home.vue{{item.authName}}{{item2.authName}}//引入模块import{reactive,onMounted}from'vue'import{useRouter}from'vue-router
- Vue.js . web前端 4096 2023-05-15 14:22:21
-
- 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前端 1907 2023-05-15 13:13:06
-
- 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前端 1378 2023-05-15 10:31:05
PHP讨论组
组员:3305人话题:1500
PHP一种被广泛应用的开放源代码的多用途脚本语言,和其他技术相比,php本身开源免费; 可以将程序嵌入于HTML中去执行, 执行效率比完全生成htmL标记的CGI要高许多,它运行在服务器端,消耗的系统资源相当少,具有跨平台强、效率高的特性,而且php支持几乎所有流行的数据库以及操作系统,最重要的是

