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

  • vue2与vue3中的生命周期执行顺序有什么区别
    vue2与vue3中的生命周期执行顺序有什么区别
    vue2与vue3中生命周期执行顺序区别生命周期比较vue2中执行顺序beforeCreate=>created=>beforeMount=>mounted=>beforeUpdate=>updated=>beforeDestroy=>destroyedvue3中执行顺序setup=>onBeforeMount=>onMounted=>onBeforeUpdate=>onUpdated=>onBeforeUnmount=&g
    Vue.js . web前端 2910 2023-05-16 21:40:33
  • Vue3怎么实现文章内容中多个关键词标记高亮显示
    Vue3怎么实现文章内容中多个关键词标记高亮显示
    具体实现过程vue-word-highlighter是一个小众的包,并不出名,Github上也只会百星出头,不过能用能跑就行,合适才是最好的,小编最近信奉一句话"程序和你一个能跑就行"。vue-word-highlighter支持Vue3和Vue2,不过Vue2版本是通过vue-demi构建的,对vue-demi不熟悉的小伙伴还是别用吧(✪ω✪),咱有一说一,用Vue2来完成该需求,有其他很多包可以推荐。至于为什么,正如它文档介绍的:基本使用它的使用比较简
    Vue.js . web前端 2856 2023-05-16 20:43:58
  • Vue3+TypeScript+Vite怎么使用require动态引入图片等静态资源
    Vue3+TypeScript+Vite怎么使用require动态引入图片等静态资源
    问题:Vue3+TypeScript+Vite的项目中如何使用require动态引入类似于图片等静态资源!描述:今天在开发项目时(项目框架为Vue3+TypeScript+Vite)需要动态引入静态资源,也就是img标签的src属性值为动态获取,按照以往的做法直接是require引入即可,如下代码:写上后代码波浪线报错,报错提示:找不到名称“require”。是否需要为节点安装类型定义?请尝试使用npmi--save-dev@types/node。ts(2580)在进行了npmi--save-d
    Vue.js . web前端 3465 2023-05-16 20:40:38
  • vue3 reactive响应式依赖收集派发更新原理是什么
    vue3 reactive响应式依赖收集派发更新原理是什么
    proxyvue3已经从Object.property更换成Proxy,Proxy相比于前者可以直接监听对象数组,对于深层次的对象和数组,会把触发对应getter,然后去递归进行依赖收集,并不是直接像vue2暴力那样递归,总体而言性能更好对reactive传进来的对象进行Proxy进行劫持在内部进行依赖收集与通知更新操作functionreactive(raw){returnnewProxy(raw,{get(target,key){constres=Reflect.get(target,key
    Vue.js . web前端 1294 2023-05-16 19:28:20
  • vue3中如何使用setup、 ref和reactive
    vue3中如何使用setup、 ref和reactive
    1.初识setUp的使用简单介绍下面的代码功能:使用ref函数,去使用监听某一个变量的变化,并且把它渲染到视图上。setUp函数是组合API的入口函数。这个是非常重要的。setUp可以去监听变量的变化哈!我们将会利用它ref在vue中内置,需要导入。{{countNum}}按钮import{ref}from'vue'exportdefault{name:'App',setup(){//这一句表示的是定义了一个变量count。这个变量
    Vue.js . web前端 2291 2023-05-16 19:22:04
  • Vue3中的导航守卫如何使用
    Vue3中的导航守卫如何使用
    一、什么是导航守卫?正如其名,vue-router提供的导航守卫主要用来通过跳转或取消的方式守卫导航。这里有很多方式植入路由导航中:全局的,单个路由独享的,或者组件级的。查看以下情形:点击主页链接时,默认情况下可直接进入指定界面,如图,但是问题是该跳转的界面是需要用户登录后方可访问的可设置导航守卫来检测用户是否登录,如果已登录,则进入后台页,如果未登录,则强制进入登录页,如图二、导航守卫有哪几种?1、全局守卫(3个)全局前置守卫每次发生路由的导航跳转时,都会触发全局前置守卫,因此,在全局前置守卫
    Vue.js . web前端 2682 2023-05-16 18:58:28
  • 怎么在Vue3中使用<script lang=“ts“ setup>语法糖
    怎么在Vue3中使用<script lang=“ts“ setup>语法糖
    迁移组件以下组件有两个道具(要显示的和一个标志)。基于这两个道具,计算模板中显示的小马图像的URL(通过另一个组件)。该组件还会在用户单击它时发出一个事件。PonyponyModelisRunningImageselectedPony.vue{{ponyModel.name}}import{computed,defineComponent,PropType}from'vue';importImagefrom'./Image.vue'
    Vue.js . web前端 3097 2023-05-16 16:39:00
  • Vue3中怎么使用Mock.js方法
    Vue3中怎么使用Mock.js方法
    mock.js简介前端开发人员用来模拟虚拟数据,拦截ajax请求,方便模拟后端接口安装npminstallmockjs使用本文主要介绍在Vue项目中使用mock.js,包括axios发送请求与请求简单封装创建mock文件夹,新建index.js文件//引入mockjsimportMockfrom"mockjs";//获取mock.Random对象constRandom=Mock.Random;//使用mockjs模拟数据lettableList=[{id:"5ffa
    Vue.js . web前端 2924 2023-05-16 16:19:18
  • vue3怎么使用reactive包裹数组正确赋值
    vue3怎么使用reactive包裹数组正确赋值
    使用reactive包裹数组正确赋值需求:将接口请求到的列表数据赋值给响应数据arrconstarr=reactive([]);constload=()=>{constres=[2,3,4,5];//假设请求接口返回的数据//方法1失败,直接赋值丢失了响应性//arr=res;//方法2这样也是失败//arr.concat(res);//方法3可以,但是很麻烦res.forEach(e=>{arr.push(e);});};vue3使用proxy,对于对象和数组都不能直接整个赋值。使
    Vue.js . web前端 7723 2023-05-16 16:10:06
  • Vue3中toRef和toRefs函数怎么使用
    Vue3中toRef和toRefs函数怎么使用
    toRef函数使用首先呢,toRef函数有两个参数。toRef(操作对象,对象属性)好,接下来我们使用toRef函数写一个案例,还是和以前一样,页面展示一个用户的名称和年纪。toReftoRefs函数姓名:{{boy_toRef}}年龄:{{boy.age}}import{toRef}from'vue'exportdefault{setup(){constboy={//创建一个用户对象name:'我是????????.',//用户名
    Vue.js . web前端 1753 2023-05-16 15:46:27
  • Vue3侦听器的实现原理是什么
    Vue3侦听器的实现原理是什么
    侦听响应式对象前面我们聊到计算属性,它可以自动计算并缓存响应式数据的值。而如果我们仅需要在响应式数据变化时,执行一些预设的操作,就可以使用watch侦听器。我们还是先来实现一个最简单的例子,然后来一点一点扩充它。constdata={foo:1}constobj=reactive(data)watch(obj,()=>{console.log('obj已改变')})在这个例子中,我们使用了watch侦听器,当obj的属性被改变时,控制台应该会打印出obj已改
    Vue.js . web前端 1628 2023-05-16 15:04:06
  • vue3 hook怎么重构DataV的全屏容器组件
    vue3 hook怎么重构DataV的全屏容器组件
    实现创建组件fullScreenContainer.vueimport{useAutoResize}from'@/hooks/useAutoResize'const{autoBindRef}=useAutoResize()自定义一个hook,导出一个autoBindRef绑定ref自定义hook文件useAutoResize.tsimport{ref}from'vue';exportfunctionuseAutoResize(){l
    Vue.js . web前端 1289 2023-05-16 14:43:06
  • vue3中getCurrentInstance怎么使用
    vue3中getCurrentInstance怎么使用
    父组件中:1.setup语法糖中导入子组件2.在子组件标签上绑定ref值3.setup内部从vue中按需导出getCurrentInstance方法4.调用getCurrentInstance方法导出proxy5.通过proxy.$refs.子组件ref名.子组件内属性/方法实现调用子组件count+1import{getCurrentInstance,ComponetInternalInstance,ref}from"vue";importChildfrom"./
    Vue.js . web前端 3393 2023-05-16 12:28:06
  • vue3中怎么通过ref获取元素节点
    vue3中怎么通过ref获取元素节点
    通过ref获取元素节点ref在vue2中可以说简化js原生的document.getElementById("#id")操作。当然在vue3中也一样首先,给你想获取到的元素一个ref属性然后,再将这个ref对象创建出来,就可以访问到他的值但是。这样在setup里边可以访问,但是直接打印出来的值为null........由于setup函数的执行时间要先于html标签的渲染,所以我们不能直接在setup函数中初始化box标签。在生命周期函数中setup函数在beforeCreat
    Vue.js . web前端 6508 2023-05-16 12:25:06
  • vue3中如何使用router路由实现跳转传参
    vue3中如何使用router路由实现跳转传参
    一、路由跳转1.首先在需要跳转的页面引入API—useRouterimport{useRouter}from'vue-router'2.在跳转页面定义router变量//先在setup中定义constrouter=useRouter()3.用router.push跳转页面//字符串router.push('home')//对象router.push({path:'home'})//
    Vue.js . web前端 2945 2023-05-16 10:49:06

PHP讨论组

组员:3305人话题:1500

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

学习途径

工具推荐

jQuery企业留言表单联系代码

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

HTML5 MP3音乐盒播放特效

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

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

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

jQuery可视化表单拖拽编辑代码

jQuery可视化表单拖拽编辑代码是一款基于jQuery和bootstrap框架制作可视化表单。
表单按钮
2024-02-29

TLShop 网店系统

TLShop 网店系统是一套轻量级的网店系统,配置简单,容易上手,可以让您迅速拥有自己的网站,管理账号和密码 admin
电商源码
2025-11-22

骑士多商户企业版卡密寄售系统

企业版卡密寄售自动发货系统。前后端代码完全开源。 主要特性 技术栈:Webman + PHP8 + MYSQL8 + Vite +TypeScript + Vue3 + TDesign Starter 有详细的代码注释,有完整系统手册 Webman框架 使用最新的 Webman 框架开发 前端使用Vue CLI框架nodejs打包,页面加载更流畅,用户体验更好 标准接口、前后端分离,二次开发更方便 支持邮件发送 支持短信发送 支持事件机制
电商源码
2025-11-22

海霆企业网站系统(HT-EWCMS)1.1

HT-EWCMS 为 Hetty - Enterprise Web Content Management System 的英文缩写,即海霆企业网站内容管理系统,HT-EWCMS为您提供一个高效快速和强大的企业网站解决方案,兼容各种主流操作系统和浏览器。HT-EWCMS著作权已在中华人民共和国国家版权局注册,海霆科技为 HT-EWCMS 产品的开发商,依法独立拥有 HT-EWCMS 产品著作权,著作权受到法律和国际公约保护。 HT-EWCMS 产品特点 01、功能实用:集10年企业建站经验,取其精华,
企业站源码
2025-11-22

HiShop网店代理分销系统

Hishop.5.2.BETA2版主要更新: [修改] 进一步优化了首页打开速度 [修改] 美化了默认模板 [修改] 优化系统架构,程序标签及SQL查询效率,访问系统页面的速度大大提高 [修改] 采用了HTML模板机制,实现了前台模板可视化编辑,降低模板制作与修改的难度. [修改] 全新更换前后台AJAX技术框架,提升了用户操作体验. 店铺管理 [新增] 整合TQ在线客服 [修改] 后台广告位增加到30个 [修改] 投票调查改为同时只能在前台显示一个,优化首页打开速度 [新增] 添加友情链接时,支持添加
电商源码
2025-11-22

INS风格感恩节模板设计下载

INS风格感恩节模板设计适用于感恩节INS模板设计 本作品提供INS风格感恩节模板设计的图片会员免费下载,格式为PSD,文件大小为30.4M; 请使用软件Photoshop进行编辑,作品中文字及图均可以通过软件修改和编辑;
psd素材
2025-11-22

浪漫地中海小镇旅行矢量图片

浪漫地中海小镇旅行矢量图片适用于地中海旅行等相关视觉场景设计的AI格式素材。
矢量素材
2025-11-21

手绘返校季开学季矢量素材

手绘返校季开学季矢量素材适用于开学季等相关视觉场景设计的AI格式素材。
矢量素材
2025-11-21

万圣节南瓜堆合集矢量素材

万圣节南瓜堆合集矢量素材适用于等相关视觉场景设计由AI生成的Ai格式素材。
矢量素材
2025-11-21

驾照考试驾校HTML5网站模板

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

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

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

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

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

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

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

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