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

  • Vue3怎么实现组件级基类
    Vue3怎么实现组件级基类
    使用mixins、extendsvue3提供了mixins和extends,但是尝试之后发现这两种方法只支持纯OptionAPI,设置的data会被识别,但是设置的setup里return的reactive,完全无效,setup也没有被执行。所以这种方式只能使用于第一种方式。使用hooks(function、class)既然官方没有提供,那么我们自己来想想办法。我们先观察一下组件的代码(第二种情况):举例import{defineComponent}from'vue&#3
    Vue.js . web前端 1370 2023-05-23 15:19:49
  • Vue3响应式核心之reactive源码分析
    Vue3响应式核心之reactive源码分析
    一、Reactive源码1、reactive源码路径:packages/reactivity/src/reactive.tsexportfunctionreactive(target:object){//iftryingtoobserveareadonlyproxy,returnthereadonlyversion.//是否是只读响应式对象if(isReadonly(target)){returntarget}returncreateReactiveObject(target,false,mut
    Vue.js . web前端 2053 2023-05-23 14:04:06
  • Vue3 echarts组件化及使用hook进行resize的方法是什么
    Vue3 echarts组件化及使用hook进行resize的方法是什么
    echarts组件化及使用hook进行resizehook本质是一个函数,把setup函数中使用的CompositionAPI进行了封装组件化echarts实例import*asechartsfrom"echarts";importuseResizefrom"@/hooks/useResize";//hook代码见下方const{proxy}=getCurrentInstance();//获取实例中的proxyletechart;letechartInst
    Vue.js . web前端 1926 2023-05-23 13:34:42
  • vue3中的createApp怎么使用
    vue3中的createApp怎么使用
    函数定义createApp函数定义在文件packages/runtime-dom/src/index.ts中exportconstcreateApp=((...args)=>{constapp=ensureRenderer().createApp(...args)if(__DEV__){injectNativeTagCheck(app)injectCompilerOptionsCheck(app)}const{mount}=appapp.mount=(containerOrSelector
    Vue.js . web前端 2823 2023-05-22 23:40:23
  • Vue3中SetUp函数的props和context参数怎么用
    Vue3中SetUp函数的props和context参数怎么用
    1.setUp函数的第1个参数propssetup(props,context){}第一个参数props:props是一个对象,包含父组件传递给子组件的所有数据。在子组件中使用props进行接收。包含配置声明并传入的所有的属性的对象也就是说:如果你想通过props的方式输出父组件传递给子组件的值。你需要使用props进行接收配置。即props:{......}如果你未通过Props进行接受配置,则输出的值是undefined父组件importNoContfrom"../componen
    Vue.js . web前端 4479 2023-05-22 21:49:04
  • vue3怎么解决axios请求封装问题
    vue3怎么解决axios请求封装问题
    vue3实战axios请求封装问题1、在src目录下创建http文件夹,在http文件夹下分别创建index.js、request.js、api.js2、index.js的作用:用于导出api.js定义的所有接口,代码如下export*from'./api';3、request.js代码如下:importaxiosfrom'axios';importbuildURLfrom'axios/lib/helpers/bui
    Vue.js . web前端 1414 2023-05-22 21:34:04
  • Vue3中关于ref和reactive的问题怎么解决
    Vue3中关于ref和reactive的问题怎么解决
    关于ref和reactive的问题如果你使用过Vue3,你知道的,在Vue3中有两个非常常用的响应式API:reactive和ref。它们会把我们想要追踪的数据变成响应式。而且我们在使用时一直被告知ref用于创建基础类型的响应式,也可以创建引用类型的响应式。而对于引用类型,底层也是转换为reactive来进行响应式处理。那既然这样为撒还需要reactive,全部使用ref不就行了吗?虽然ref创建的响应式数据在脚本中需要通过.value才能访问到呀!但是这里肯定影响不大。并且在模板中会自动添加上
    Vue.js . web前端 1232 2023-05-22 19:26:20
  • 怎么用Vue3和Element Plus实现自动导入
    怎么用Vue3和Element Plus实现自动导入
    1前言1.1目的ElementPlus使用按需引入,大大缩小打包后的文件大小1.2最终效果自动生成components.d.ts文件,并在文件中引入ElementPlus组件自动生成components.d.ts文件,并在文件中引入ElementPlusAPI2准备工作安装ElementPlus#选择一个你喜欢的包管理器#NPM$npminstallelement-plus--save#Yarn$yarnaddelement-plus#pnpm$pnpminstallelement-plus3按
    Vue.js . web前端 2114 2023-05-22 16:58:07
  • Vite创建Vue3项目及Vue3使用jsx的方法
    Vite创建Vue3项目及Vue3使用jsx的方法
    Vite创建Vue3项目Vite需要Node.js版本>=12.0.0。(node-v查看自己当前的node版本)使用yarn:yarncreate@vitejs/app使用npm:npminit@vitejs/app1.输入项目名称这里输入我们的项目名称:vite-vue32.选择框架这里选择我们需要集成的框架:vuevanilla:原生js,没有任何框架集成vue:vue3框架,只支持vue3react:react框架preact:轻量化react框架lit-element:轻量级we
    Vue.js . web前端 2857 2023-05-22 13:58:20
  • Vue3列表动画和状态动画怎么应用
    Vue3列表动画和状态动画怎么应用
    概述列表动画和状态动画都是增加用户体验的方法,当一个列表添加数据或者移除数据时,如果直接添加,突然显示,未免有些突兀,而且用户可能会不知道此时已经有数据加入了,从列表中移除数据也是,用户很有可能不知道当前已经移除了哪一条数据。但是如果加上动画就会好很多了,有趣的动画可以吸引用户的注意力,让用户关注新增和移除的数据。这就是列表动画,而状态动画是指从一个状态到另一个状态的变化,如果直接变过去,就会显得比较生硬,但是如果是加了动画慢慢过渡过去会好很多。示例解析列表动画如上图所示我们要展示一个数字构成的
    Vue.js . web前端 1554 2023-05-22 09:43:19
  • vue3中组件间怎么传值
    vue3中组件间怎么传值
    vue3组件间的传值(props)父组件向子组件传值在父组件中:1.引入ref2.定义要传递的属性和属性值3.向vue页面中的子组件传递该属性属性传递属性:传给子组件的名字(自定义)=“对应定义在父组件的属性名”在子组件中:4.接收父组件传来的属性props:{showDialogVisible:Boolean},setup(){return{}}5.注册该组件setup(props){//可以打印查看一下props传过来的属性以及属性的值console.log(props);return{pr
    Vue.js . web前端 13265 2023-05-22 08:58:21
  • Vue3中的异步组件defineAsyncComponentAPI怎么使用
    Vue3中的异步组件defineAsyncComponentAPI怎么使用
    传递工厂函数作为参数defineAsyncComponent方法接收一个工厂函数是它的基本用法,这个工厂函数必须返回一个Promise,Promise的resolve应该返回一个组件。我们这里以VueCli创建的项目为例,这里我稍微做了一下修改,将头部的图片拆分为一个组件,代码如下:importLogoImgfrom'./components/LogoImg.vue'importHelloWorldfrom'./components/HelloWo
    Vue.js . web前端 1238 2023-05-21 20:43:04
  • Vue3跨域配置devServer参数的方法是什么
    Vue3跨域配置devServer参数的方法是什么
    devServer是一个用于配置开发服务器的选项对象。它可以用来配置服务器的各种选项,例如代理,端口号,HTTPS等。以下是一些常用的devServer参数和设置:port:指定开发服务器的端口号,默认为8080。host:指定开发服务器的主机名,默认为localhost。https:开启HTTPS,可以传入一个Object类型的参数,用于配置HTTPS选项。open:自动打开浏览器,默认为false。可以传入一个String类型的参数,用于指定浏览器的名称。proxy:用于配置代理。可以传入一
    Vue.js . web前端 1569 2023-05-21 18:38:02
  • vue3+vite:src使用require动态导入图片报错怎么解决
    vue3+vite:src使用require动态导入图片报错怎么解决
    vue3+vite:src使用require动态导入图片报错和解决方法vue3+vite动态的导入多张图片vue3如果使用的是typescript开发,就会出现require引入图片报错,requireisnotdefined不能像使用vue2这样imgUrl:require(’…/assets/test.png’)导入,是因为typescript不支持require所以用import导入,下面介绍如何解决:使用awaitimport
    Vue.js . web前端 5535 2023-05-21 15:16:06
  • Vue3怎么将组件手动渲染到指定元素中
    Vue3怎么将组件手动渲染到指定元素中
    将组件转换为自定义元素文档:Vue与WebComponents|Vue.js(vuejs.org)Vue对WebComponents提供了良好的支持。可以使用defineCustomElement将组件转换为自定义元素。随后就可以自由插入到DOM节点中了。import{defineCustomElement}from'vue'constMyVueElement=defineCustomElement({//这里是同平常一样的Vue组件选项props:{},emit
    Vue.js . web前端 2633 2023-05-21 13:59:18

PHP讨论组

组员:3305人话题:1500

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

学习途径

工具推荐

jQuery点击文字滚动Scrollocue插件

jQuery点击文字滚动Scrollocue插件是一款用于构建一个简单的提示提词器系统的jQuery小插件。本作品由【站长素材】收集整理,转载请注明出处!
文字特效
2025-12-19

CSS3聚光灯下倒影文字特效

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

jQuery企业留言表单联系代码

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

HTML5 MP3音乐盒播放特效

HTML5 MP3音乐盒播放特效是一款基于html5+css3制作可爱的音乐盒表情,点击开关按钮mp3音乐播放器。
播放器特效
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

国际癫痫日方形海报设计源文件下载

国际癫痫日方形海报设计源文件适用于国际癫痫日海报模板设计 本作品提供国际癫痫日方形海报设计源文件的图片会员免费下载,格式为PSD,文件大小为32.2M; 请使用软件Photoshop进行编辑,作品中文字及图均可以通过软件修改和编辑;
psd素材
2025-12-19

情人节快乐折扣方形海报PSD模板下载

情人节快乐折扣方形海报PSD模板适用于情人节快乐海报设计 本作品提供情人节快乐折扣方形海报PSD模板的图片会员免费下载,格式为PSD,文件大小为36.2M; 请使用软件Photoshop进行编辑,作品中文字及图均可以通过软件修改和编辑;
psd素材
2025-12-19

烘焙面包图标合集矢量素材

烘焙面包图标合集矢量素材适用于烘焙等相关视觉场景设计的由AI生成的Ai格式素材。
矢量素材
2025-12-19

2026年新年快乐横幅海报设计下载

2026年新年快乐横幅海报设计适用于新年快乐横幅设计 本作品提供2026年新年快乐横幅海报设计的图片会员免费下载,格式为PSD,文件大小为7.3M; 请使用软件Photoshop进行编辑,作品中文字及图均可以通过软件修改和编辑;
psd素材
2025-12-19

驾照考试驾校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号