草庐IT

Vue-Router

全部标签

前端2024加分技能:官网3D Banner效果 three.js+vue实现

官网3DBanner效果three.js+vue实现最近没什么事,写了一个3DBanner效果,给广大前端同行们分享下。在线3D体验地址1:http://www.webgl3d.cn/3D/banner1/index.html在线3D体验地址2:http://www.webgl3d.cn/3D/banner3/index.html【视频展示】https://www.bilibili.com/video/BV1Ci4y1e7XX/?share_source=copy_web&vd_source=026f0cd0b145ec9bc2c005d9eaf67b0b官网3DBanner大部分官网的Ban

使用 CRXJS、Vite、TypeScript、Vue3、Pinia、Less、Naive-ui 开发 Chrome 浏览器插件——自带热加载,无需手动配置 vite.config.ts 文件

一、CRXJS一、什么是CRXJS?CRXJSVitePlugin是一款使用现代Web开发技术制作Chrome扩展的工具二、CRXJS的作用CRXJS支持热加载和静态资源导入,无需手动构建配置工具CRXJSVite插件通过将Vite的精细功能与简单的配置策略相结合,简化了Chrome扩展开发者体验二、使用Vue开发Chrome插件一、创建Vue项目1.使用Vite创建Vue项目npmcreatevite@latest#npmyarncreatevite #yarnpnpmcreatevite #pnpm选择Vue和TS进入项目,并进行pnpmi安装node_modulespnpmi#安

vue.js - Nuxt 404 错误页面应该重定向到主页

我正在寻找一种方法,当页面不存在时使用Nuxt.Js始终重定向到主页。几天前,我们的站点地图生成出现了一些问题,我们提交了不存在的错误网址。GoogleSearchConsole显示大量404,我们希望通过301重定向到主页来修复它们。我试过了created(){this.$router.push(this.localePath({name:'index',query:{e:'er'}}))}虽然页面成功重定向到主页,但我认为Google会遇到问题,因为页面最初呈现为404。这个我也试过asyncasyncData({redirect}){returnredirect(301,'/el

【开源】基于JAVA+Vue+SpringBoot的网上药店系统

目录一、摘要1.1项目介绍1.2项目录屏二、功能模块2.1数据中心模块2.2药品类型模块2.3药品档案模块2.4药品订单模块2.5药品收藏模块2.6药品资讯模块三、系统设计3.1用例设计3.2数据库设计3.2.1角色表3.2.2药品表3.2.3药品订单表3.2.4药品收藏表3.2.5药品留言表四、系统展示五、核心代码5.1查询药品5.2查询药品类型5.3药品收藏5.4药品加购5.5新增药品留言六、免责说明一、摘要1.1项目介绍基于JAVA+Vue+SpringBoot+MySQL的网上药店系统,包含了药品类型模块、药品档案模块、药品收藏模块、药品订单模块、药品资讯模块,还包含系统自带的用户管理

Vue项目引入translate.js 国际化自动翻译组件

建议translate.js配合i18使用本文只介绍translate.js的引入和使用方式无论什么库 在翻译上都不会做到(100%翻译 &&100%准确)吹毛求疵绕路官方文档:translate.js前端翻译该组件优点:自动翻译自动匹配本地语种利于SEO对搜索引擎友好使用简单直接引入使用即可瞬时翻译使用了缓存预加载该组件缺点正因为利于SEO假设中译英获取DOM节点的时候还是中文DOM不刷新DOM内容刷新时不会自动翻译所以最好配合i18使用1.安装npmii18n-jsautotranslate2.引入在main.js内importtranslatefrom'i18n-jsautotransl

使用自定义组件模板内的V-For可以使用VUE JS?

我在网上什么也没发现。我想知道的是是否可以使用v-for定制组件模板内的指令。这是我所做的:html自定义组件Vue.component('lista-servizi',{template:''+''+''+''+'{{single.nomeServizio}}{{index}}'+''+'"'+''+''+''+''+'{{single.descrizione}}'+''+''+'',props:['servizi'],computed:{listaServizi(){returnthis.servizi}}我在控制台中有以下错误:-taghasnomatchingendtag.foundi

Vue - Element UI 级联选择器 el-cascader 组件设置点击 label 文字直接选中,无需点击圆形单选框选中(解决开启 “单选模式“ 后无法通过点击整行直接选中的问题)

前言如果您需要Vue3版本,请访问这篇文章。本文实现了在vue+elementUI项目开发中,el-cascader级联选择器开启“严格单选模式(父子节点取消选中关联,达到选择任意一级选项)”后,选中操作改为直接“点击文字整行”就能选中,并且点击后自动隐藏收起下拉弹框功能,网上千篇一律的无效方案,本文的方案保证不影响全局样式、不影响其他级联组件工作,强大好用。如下图所示,现在可以点击文字或单选圆圈选中,并且局部独立不互相影响!示例代码干净整洁,新手小白复制粘贴即用!示例代码此解决方案是通用的,也就是说复选框、单选框,单选和多选都可以使用。随便找个页面,一键复制运行起来即可。template

Vue3学习(十八) - TreeSelect 树选择

写在前面本以为可以在家学习一天,结果家里来了客人拜年,就没学习上,有点小遗憾吧。昨天完成从分类管理的前后端代码复制出文档管理的前后端代码,遗留问题是只能选择一级父分类。值得说的是,昨晚的遗留的问题修复了,开心。遗留问题点击父文档,弹出警告,从报错来看那意思就是parent应该是一个对象,我却给他一个string字符串。解决方案:将parent改造为对象:node.parent={'id':node.parent}使用树形选择组件选择父节点1、从分类管理的前后端代码复制出文档管理的前后端代码此处略,参考以前2、TreeSelect树选择使用其实就是将原来一级分类,改为可以多级分类选择,这里我们就

Vue 3 的 setup语法糖到底是什么东西?

前言我们每天写vue3项目的时候都会使用setup语法糖,但是你有没有思考过下面几个问题。setup语法糖经过编译后是什么样子的?为什么在setup顶层定义的变量可以在template中可以直接使用?为什么import一个组件后就可以直接使用,无需使用components 选项来显式注册组件?vue文件如何渲染到浏览器上要回答上面的问题,我们先来了解一下从一个vue文件到渲染到浏览器这一过程经历了什么?我们的vue代码一般都是写在后缀名为vue的文件上,显然浏览器是不认识vue文件的,浏览器只认识html、css、jss等文件。所以第一步就是通过webpack或者vite将一个vue文件编译为

amazon-s3 - React Router + AWS 后端,如何做 SEO

我在单页Web应用程序中使用React和ReactRouter。因为我在做客户端渲染,所以我想用CDN来提供我所有的静态文件(HTML、CSS、JS)。我使用AmazonS3来托管文件,并使用AmazonCloudFront作为CDN。当用户请求/css/styles.css时,该文件存在,因此S3提供它。当用户请求/foo/bar时,这是一个动态URL,因此S3添加了一个hashbang:/#!/foo/bar。这将服务于index.html。在我的客户端,我删除了hashbang,所以我的URL很漂亮。这对我100%的用户来说都很好。所有静态文件都通过CDN提供动态URL将被路由到