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

  • 基于vue3和element-plus的暗黑模式怎么实现
    基于vue3和element-plus的暗黑模式怎么实现
    一、基本使用因为是通过在html标签上添加dark类,可以自行实现切换但为了方便切换以及进一步的定制化,官方推荐使用useDark|VueUse示例:以下,基于element-plusswitch组件创建了一个暗黑模式开关组件,将它放入菜单栏,就可以方便地切换模式了import{useDark,useToggle}from'@vueuse/core'constisDark=useDark()consttoggleDark=useToggle(isDark)暗黑模式
    Vue.js . web前端 3048 2023-05-13 18:37:06
  • vue3+vite中如何使用import.meta.glob
    vue3+vite中如何使用import.meta.glob
    前言:在vue2的时候,我们一般引入多个js或者其他文件,一般使用require.context来引入多个不同的文件,但是vite中是不支持require的,他推出了一个类似的功能,就是用import.meta.glob来引入多个,单个的文件。这里说说他们的对比和区别:vue2中使用require来引入多个不同的js文件1、引入modules下的所有的js文件constmodulesFiles=require.context('./modules',true,/\
    Vue.js . web前端 3130 2023-05-13 18:01:06
  • vue3使用ref的性能警告问题怎么解决
    vue3使用ref的性能警告问题怎么解决
    vue3使用ref的性能警告问题使用ref的性能警告代码如下import{ref,shallowRef}from"vue";importTodoListfrom"./components/TodoList.vue";importRatefrom"./components/Rate.vue";lettabs={TodoList,Rate}letcurrentTabComponent=ref(TodoList)警告runtime-core.
    Vue.js . web前端 2979 2023-05-13 15:10:06
  • VUE3+TS获取组件类型遇到的坑怎么解决
    VUE3+TS获取组件类型遇到的坑怎么解决
    VUE3+TS获取组件类型的方法踩坑获取组件类型的方法constAccountRef=ref()遇到的坑typeofLoginAccount一直报红线提示错误LoginAction:()=>vo...'providesnomatchforthesignature'new(...args:any):any'.问题原因使用的是webstormcodeing,通过webstorm自带右键新建vue文件,创建出来的文件是不带defineCompone
    Vue.js . web前端 1298 2023-05-13 14:46:06
  • vue3如何使用vue-codemirror插件
    vue3如何使用vue-codemirror插件
    使用1.命令行安装npminstallvue-codemirror--save//cnpminstallvue-codemirror--save如果运行官网例子时,报错:@codemirror/lang-javascript@codemirror/theme-one-dark可以在终端中安装对应文件,解决问题npmi@codemirror/lang-javascriptnpmi@codemirror/theme-one-dark2.在需要的组件中配置import{Codemirror}from&
    Vue.js . web前端 5607 2023-05-13 12:49:11
  • Vue3 ref构建响应式变量失效如何解决
    Vue3 ref构建响应式变量失效如何解决
    vue3ref构建响应式变量失效问题描述在Vue3中使用ref声明响应式变量,同时用函数对值进行变化,但是无法响应式改变值{{userName}}change//引入定义响应式数据的函数import{reactive}from'vue';import{ref}from"@vue/reactivity";//!!!!!注意,这里有个坑,ref必须是引用自vue,而非@vue/reactivityexportdefault{name:&#3
    Vue.js . web前端 1511 2023-05-13 10:43:11
  • Vue3中setup怎么添加name
    Vue3中setup怎么添加name
    Vue3中name有什么用呢?1.在递归组件的时候需要定义name2.配合keep-aliveincludeexclude可以缓存组件3.在Vue有报错或者调试的时候可以看到组件的nameVue3定义name1.自动生成只要在script开启setup语法糖模式单文件组件会自动根据文件名生成对应的name选项例如Tree.vue那他的name就是Tree自动生成,这样做有一个弊端如果想修改name需要修改组件名称如果有地方import该组件需要一并修改。2.在开启一个script用来定义name
    Vue.js . web前端 3481 2023-05-13 09:40:06
  • Vue3中样式渗透:deep()无效怎么解决
    Vue3中样式渗透:deep()无效怎么解决
    :deep()的使用场景:如果给当前组件的style节点添加了scoped属性,则当前组件的样式对其子组件是不生效的。如果想让某些样式对子组件生效,则需要使用:deep()。我原本觉得这个没有难度,于是写了个案例来验证。然后问题出现了,:deep()定义的样式在子组件中不起作用。我开始找错,把包括冒号、括号在内的语法格式等都检查了一遍,发现语法格式没有问题,控制台也不报错,但是:deep()格式的样式在子组件中就是无效。幸好我这儿有一个:deep()格式起作用的范例,没办法,只好把两个文件中的父
    Vue.js . web前端 3844 2023-05-13 08:40:05
  • vue3全局组件自动注册功能如何实现
    vue3全局组件自动注册功能如何实现
    vue3全局组件自动注册第一步:建文件需要在src/components下创建一个文件夹用于存放封装的公共组件(这里我起名叫coms)需要在src/components下创建一个js文件用于存放引入组件并注册(这里我起名叫Index.js)第二步:写函数在coms中建文件夹,将组件放入这个文件夹,此文件夹的名字就是我们将要注册组件的名字。在Index.js中写入以下工具函数://全局组件注册需要到coms这个目录下注册exportdefault{install(app){constreq=req
    Vue.js . web前端 3545 2023-05-13 08:13:05
  • 怎么用Vue3指令实现水印背景
    怎么用Vue3指令实现水印背景
    页面水印业务相信我们都有遇过,为什么需要给页面添加水印?为了保护自己的版权和知识产权,给图片加上水印一般是为了防止盗图者用于商业用途,损害原作者的权益。那么在我们开发当中有什么方法可以实现呢?一般分为前端实现和后端实现这两种方法,本文主要是学习前端实现方法:方式一:直接将字体用块元素包裹,动态设置绝对定位,然后通过transform属性旋转。但是需要考虑一个问题,当图片过大或图片过多时会很影响性能,所以就不详细说这一方式了。方式二:canvas上绘制出字体,设置好样式,最后以图片的样式导出,用图
    Vue.js . web前端 2290 2023-05-12 23:07:14
  • vue3+electron12+dll开发客户端配置的方法
    vue3+electron12+dll开发客户端配置的方法
    修改仓库源由于electron版本的未知性,可能存在serve可用而build之后打开白屏的情况,因此需要谨慎对待。最好在版本可用的情况下commit一个版本,方便代码回滚,如果谁有更好的资料希望共享。在开始配置前,可以将yarn和npm的rc文件稍作修改,使用命令或者文件直接修改.npmrc或者.yarnrc,这两个全局配置文件一般在C:\user\你的当前账户这个文件夹下,或者在当前项目下新建文件命令rc文件以局部更改配置。因为electron下载会因为网络问题而失败,因此修改为淘宝源,华为
    Vue.js . web前端 1918 2023-05-12 22:43:13
  • Vue3中的h函数如何使用
    Vue3中的h函数如何使用
    简介众所周知,vue内部构建的其实是虚拟DOM,而虚拟DOM是由虚拟节点生成的,实质上虚拟节点也就是一个js对象事实上,我们在vue中写的template,最终也是经过渲染函数生成对应的VNode而h函数就是用来生成VNode的一个函数,他的全名叫做createVNode简单使用参数他一共跟三个参数第一个参数是一个字符串,他是必须的这个字符串可以是html标签名,一个组件、一个异步的组件或者是函数组件第二个参数是一个对象,可选的与attribute、prop和事件相对应的对象第三个参数可以是字符
    Vue.js . web前端 3984 2023-05-12 22:16:10
  • 怎么使用Vue3+Canvas实现简易的贪吃蛇游戏
    怎么使用Vue3+Canvas实现简易的贪吃蛇游戏
    规则玩法:玩家使用方向键操控一条长长的蛇不断吞下豆子,同时蛇身随着吞下的豆子不断变长,当蛇头撞到蛇身或障壁时游戏结束。思路元素:边界、蛇头、蛇身、食物边界:输入行数x,列数y生成边界地图,用二维坐标标识每个点的位置;蛇头、蛇身:蛇头和蛇身分离,当吃到食物后,蛇身尾部加一食物:位置随机生成;流程图代码实现技术栈选择vue3、vite基础架构;视图选用canvas技术来实现,相比dom来说性能更好;基本变量定义import{ref,onMounted}from'vue&#39
    Vue.js . web前端 1552 2023-05-12 21:58:04
  • vue3中watch和watchEffect使用实例分析
    vue3中watch和watchEffect使用实例分析
    watchwatch监听单个数据import{ref,watch}from'vue'consttext1=ref('')watch(text1,(newVal,oldVal)=>{console.log('监听单个数据',newVal,oldVal)})watch监听多个数据import{ref,watch}from'vue'consttext1=ref(&
    Vue.js . web前端 1134 2023-05-12 21:43:04
  • vue3 table组件怎么使用
    vue3 table组件怎么使用
    基础表格首先开发table组件之前,先想好要用什么样式的api,因为笔者在生产工作中用的都是element,所以前面几个组件风格和element类似,但是这次不打算用element的风格了,打算换一种,直接展示:我们期望用户这样使用:constdataList=[{id:1,name:'《JavaEE企业应用实战》',author:'dev1ce',price:'10.22',desc:&#3
    Vue.js . web前端 1410 2023-05-12 21:40:12

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

H5自适应企业网站源码1.0.1

H5自适应企业网站源码是一套非常优秀的asp自适应企业网站源码,这套源码有很多优秀的功能,也是很多企业网站所不具备的。H5自适应企业网站源码使用asp+access搭建,运行环境要求windows+IIS。网站前台是动态页面,不过网址URL已经做了伪静态处理,URL的格式都是.html结尾,对搜索引擎也比较友好。H5自适应企业网站源码的一个亮点功能就是会员等级制度及权限划分功能,普通会员栏目发布的产品,只有注册会员才能查看,没有注册的访客在查看普通会员栏目是会要求访客注册后查看;高级会员栏目发布的产品则
企业站源码
2025-11-22

ShopWind多用户商城系统

ShopWind是一款基于Yii2.0框架深度重构的B2B2C、O2O行业的电商系统软件,您可以轻松创建和发布属于自己品牌的专业的电商平台,进行全方位的品牌宣传和产品推广。ShopWind v3.x标准版开始走向开源,打造一款完全开源的电商系统,可以免费用于商业运营或者二次开发,免于商业版权的烦恼。v3.x商业版包含PC、手机H5、微商城、APP客户端(Andorid+iOS)、微信小程序、今日头条小程序等多端,其中PC端为开源免费项目,移动端为增值项目。ShopWind提供专业、快速、安全的底层软件设
电商源码
2025-11-22

能飞网络办公OA系统

个人办公、客户管理、通讯中心、学习园地、论坛交流、资源下载、个人工具、邮箱等功能
电商源码
2025-11-22

易优制冷机械设备网站源码1.6.9

易优制冷机械设备网站源码是基于易优cms开发,适合企业进行制冷设备展示使用。程序内核为Thinkphp5.0开发,后台简洁,为企业网站而生。 这是一套安装就能建站的程序,不定期更新程序BUG,更新网站功能。 我们提供的不仅是模板这么简单,我们还提供程序相关咨询、协助安装等服务。 默认不包含小程序插件,需要另外单独购买插件。 模板安装步骤 1、请将安装包ZIP上传到你的网站根目录,在线解压 2、安装模板系统:直接运行:http://您的域名/install
企业站源码
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号