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

  • vue3怎么动态添加路由
    vue3怎么动态添加路由
    一、初始化项目初始化vite+vue+ts项目,引入vue-router。目录结构如下,注意这个404重定向,vue3不支持直接使用“*”匹配所有路由了,要使用:catchAll(.*)。初始化路由:import{createRouter,createWebHashHistory}from"vue-router";constroutes=[{path:"/",component:()=>import("../views/HomePage.v
    Vue.js . web前端 4604 2023-05-17 23:22:16
  • vue3子组件之间相互传值问题怎么解决
    vue3子组件之间相互传值问题怎么解决
    vue3子组件之间相互传值1、引用第三方库mittnpminstallmitt2、在项目src文件夹下创建utils文件夹,在utils创建mitt.js,mitt.js中的代码如下:importmittfrom"mitt";exportdefaultnewmitt();3、示例:组件A传值给组件B//在组件A中引入importmittfrom"@/utils/mitt";//调用传值mitt.emit("mittClick",&quo
    Vue.js . web前端 1904 2023-05-17 20:19:04
  • vue3编译优化的内容有哪些
    vue3编译优化的内容有哪些
    vue3编译优化有:1、引入了patchFlag,用来标记动态内容;在编译过程中会根据不同的属性类型打上不同的标识,从而实现了快速diff算法。2、BlockTree。3、静态提升,是将静态的节点或者属性提升出去。4、预解析字符串化,当连续静态节点超过10个时,会将静态节点序列化为字符串。5、函数缓存;开启cacheHandlers选项后,函数会被缓存起来,后续可直接使用。本文主要来分析Vue3.0编译阶段做的优化,在patch阶段是如何利用这些优化策略来减少比对次数。由于组件更新时依然需要遍历
    Vue.js . web前端 1585 2023-05-17 17:50:16
  • Vue3.0在组件外使用VueI18n的情况是什么
    Vue3.0在组件外使用VueI18n的情况是什么
    vue3.0在组件外使用VueI18n通常将写在setup里面的代码写在外面会报错Mustbecalledatthetopofa`setup`意思是必须写在setup里面要将i18n与Vue3的组合API一起使用,但在组件的setup()之外,需要这么写//locales/setupI18n.tsimport{App}from'vue';import{createI18n}from'vue-i18n';//引入vue-i18n组件i
    Vue.js . web前端 2528 2023-05-17 17:01:06
  • vue3怎么使用svg图标
    vue3怎么使用svg图标
    方式1使用在线链接访问在iconfont找到自己的项目的图标选择Symbol获取在线链接2:在vue3项目中找到public的index.html进行script进行引入打开浏览器看:这样就会自动注入到body下在项目直接使用//控制图标的大小显示出了删除的图标封装的写法(上面的代码写着太重复下面进行封装)1:新建一个专门获取svg图标的组件icon.vue(svg/index.vue)import{defineProps,withDefaults}from"vue";con
    Vue.js . web前端 2453 2023-05-17 16:52:14
  • vue3中怎么使用element-plus调用message
    vue3中怎么使用element-plus调用message
    vue3使用element-plus调用message环境:vue3+typescript+element-plus1.全局引入element之后element已经在app.config.globalProperties添加了全局方法$message所以在optionsAPI中可以直接使用mounted(){(thisasany).$message.success("this.$message");}2.在CompositionAPI中setup方法传入了两个变量props和
    Vue.js . web前端 4015 2023-05-17 15:52:31
  • vue3下的watch怎么使用
    vue3下的watch怎么使用
    既然是数据监听,监听的是它的变化。那么就需要能够捕获它的变更,于是监听的数据必然要是响应式数据watch(WatcherSource,Callback,[WatchOptions])参数:WatcherSource:想要监听的响应式数据。Callback:执行的回调函数,入参(newValue,oldValue)。[WatchOptions]:deep、immediate、flush可选。对于WatchOptions的参数配置:deep:当需要对对象等引用类型数据进行深度监听时,设置deep:t
    Vue.js . web前端 3680 2023-05-17 12:14:26
  • Vue3中echarts无法缩放如何解决
    Vue3中echarts无法缩放如何解决
    问题描述官网示例正常1、打开echarts官网示例:https://echarts.apache.org/examples/zh/editor.html?c=area-rainfall这个示例的缩放功能是正常的。如下图:官网示例在本地缩放异常把上面这个demo的option复制到本地环境,运行效果:初始渲染正常,拖动缩放把手就报js错误。如下图:点击进入错误堆栈,发现报seriesModel的coordinateSystem这个属性为undefined开始以为是echarts版本与官网的版本不一
    Vue.js . web前端 1500 2023-05-17 11:58:40
  • Vue3中的setup语法糖、computed函数、watch函数如何用
    Vue3中的setup语法糖、computed函数、watch函数如何用
    setup语法糖大家发现没有,在我们前面几篇文章中的案例代码中,每个案例的模板中都有一些雷同代码,这些代码就是我们的setup函数,但是作为组合API的入口函数,我们所有的组合式API都要写到里面,难道我们每次都要写上这一坨么,其实在Vue中提供了setup的语法糖,语法糖大家都知道是什么嘛?就比如我们Vue2中的v-model不就是语法糖么,可以通过这样一个指令省去了大量的双向数据绑定的代码!那我们来看一下我们的setup都够简化成为什么样子,以下面代码为例,我们声明一个函数,点击按钮触发喊出
    Vue.js . web前端 3430 2023-05-17 11:58:06
  • vue3怎么使用defineExpose
    vue3怎么使用defineExpose
    可以通过defineExpose编译器宏来显式指定在组件中要暴露出去的属性:import{ref}from'vue'consta=1constb=ref(2)defineExpose({a,b})当父组件通过模板引用的方式获取到当前组件的实例,获取到的实例会像这样{a:number,b:number}(ref会和在普通实例中一样被自动解包)例子父组件defineExpose使用父组件importChildfrom"@/components/exposeC
    Vue.js . web前端 2214 2023-05-17 10:04:05
  • Vue3开发实例代码分析
    Vue3开发实例代码分析
    获取thisVue2中每个组件里使用this都指向当前组件实例,this上还包含了全局挂载的东西,都知道this.xxx啥都有而Vue3中没有this,如果想要类似的用法有两种,一是获取当前组件实例,二是获取全局实例,如下自己可以去打印出来看看import{getCurrentInstance}from'vue'//proxy就是当前组件实例,可以理解为组件级别的this,没有全局的、路由、状态管理之类的const{proxy,appContext}=getCur
    Vue.js . web前端 2059 2023-05-17 09:44:18
  • vue3项目打包发布到服务器后访问页面显示空白怎么解决
    vue3项目打包发布到服务器后访问页面显示空白怎么解决
    vue3项目打包发布到服务器后访问页面显示空白1、处理vue.config.js文件中的publicPath处理如下:const{defineConfig}=require('@vue/cli-service')module.exports=defineConfig({publicPath:process.env.NODE_ENV==='production'?'./':'/&
    Vue.js . web前端 9583 2023-05-17 08:19:37
  • vue3组件化开发常用API知识点有哪些
    vue3组件化开发常用API知识点有哪些
    组件化思想为什么使用组件化开发?当前前端比较流行的VueReact等框架,都会通过编写组件来完成业务需求,也就是组件化开发。包括小程序开发也会用到组件化开发的思想。分析组件化思想开发应用程序:将一个完整页面拆分成很多个小组件每个组件用于完成页面的一个功能模块每一个组件还可以细分(父子组件)通用的组件可以复用到不同的页面一个Vue的页面,应该像是棵嵌套的组件树的形式来组织:vue3入口文件:import{createApp}from'vue';importAppfr
    Vue.js . web前端 1154 2023-05-16 22:55:26
  • Vue3页面局部刷新组件的刷新问题怎么解决
    Vue3页面局部刷新组件的刷新问题怎么解决
    开始操作vue3的生命周期和vue2的生命周期是完全不一样的vue2和vue3的区别我这里就简单介绍一下2者的区别Vue2与Vue3最大的区别:Vue2使用选项类型API(OptionsAPI)对比Vue3合成型API(CompositionAPI)旧的选项型API在代码里分割了不同的属性:data,computed属性,methods,等等。新的合成型API能让我们用方法(function)来分割,相比于旧的API使用属性来分组,这样代码会更加简便和整洁。vue2exportdefault{p
    Vue.js . web前端 2732 2023-05-16 22:37:19
  • Vue3里的EffectScope怎么使用
    Vue3里的EffectScope怎么使用
    Vue3.2版本引入了新的EffectscopeAPI,使用effectScope创建一个effect作用域,可以捕获其中所创建的响应式副作用(即计算属性和侦听器),这样捕获到的副作用可以一起处理。使用getCurrentScope返回当前活跃的effect作用域。使用onScopeDispose在当前活跃的effect作用域上注册一个处理回调函数。当相关的effect作用域停止时会调用这个回调函数。constscope=effectScope()scope.run(()=>{constd
    Vue.js . web前端 1123 2023-05-16 22:16:54

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号