草庐IT

Vue-Instant

全部标签

vue的h渲染函数和customRender在ant design vue的table组件的使用

需求和解决使用antdesignvue的table组件,没有使用插槽的情况下,我想你给我使用tooltip,这样子我就不用又写插槽又写html结构了因为我们使用table组件,想自定义结构,一般是先使用插槽,然后插槽填写内容,比如下面做法constcolumns=[{title:'演示',dataIndex:'demo',slots:{customRender:'demo'},ellipsis:true,align:'center',},]a-table:columns="columns"> template#demo={record,text}>a-tooltip> template#tit

基于Java+SpringBoot+Vue前后端分离旅游网站详细设计和实现

博主介绍:✌全网粉丝30W+,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌🍅文末获取源码联系🍅👇🏻 精彩专栏推荐订阅👇🏻 不然下次找不到哟2022-2024年最全的计算机软件毕业设计选题大全:1000个热门选题推荐✅Java项目精品实战案例《100套》Java微信小程序项目实战《100套》​ 系统介绍:随着科学技术的飞速发展,各行各业都在努力与现代先进技术接轨,通过科技手段提高自身的优势,旅游网站当然也不能排除在外,随着旅游网站的不断成熟,它彻底改变了过去传统的旅游网站

Vue生命周期函数(详解)

目录 生命周期图生命周期函数beforeCreate和created的区别beforeCreate创建前应用场景 created创建后应用场景beforeMount和mounted的区别 beforeMount挂载前应用场景 mounted挂载后应用场景 beforeUpdate和updated的区别 beforeUpdate更新前应用场景 updated更新后应用场景 beforeDestroy和destroyed的区别 beforeDestroy销毁前 destroyed销毁后总结 生命周期图 上图生命周期每个红色的钩子是一个阶段,可以在每个不同的阶段写合适的代码。生命周期函数生命周期分为

vue使用Element UI时,el-table表格整行操作单选禁选并隐藏全选框

需求场景:需求:表格复选修改为单选,只可选择一个;不满足条件的不可勾选;可进行整行操作vue中的el-table布局:注意使用的方法.{{scope.$index+(page.pageNum-1)*page.pageSize+1}}单选样式需求由复选改为单选后,左上角全选框要进行隐藏,复选框也变成单选框,这里是通过css样式进行调整的//隐藏表头全选复选框//(主要目的就是隐藏全选复选框,亲测具体项目细节不同可能实现方式不同,如果不生效需要调整下)/deep/.el-tablethead{//第一种.el-checkbox__input{display:none!important;}}/de

vue.config.js配置详解

vue.config.js是一个可选的配置文件,如果项目的(和package.json同级的)根目录中存在这个文件,那么它会被@vue/cli-service自动加载。你也可以使用package.json中的vue字段,但是注意这种写法需要你严格遵照JSON的格式来写。以下是vue.config.js的一个基本配置:module.exports={//部署应用包时的基本URLpublicPath:process.env.NODE_ENV==='production'?'/production-sub-path/':'/',//构建输出目录outputDir:'dist',//静态资源目录ass

前端埋点需求(vue.js)

提示:基于运营活动的需求,需要对用户行为进行埋点监控,因此以下文章是代码埋点的实现。文章目录前言一、埋点思考二、埋点实现1.埋点工具类实现(operationLog.js)2.埋点监控的开启3.页面访问日志的写入4.点击事件的日志写入总结前言前端埋点有两种:全局埋点、代码埋点。全局埋点:收集的用户所有行为,但是收集的数据驳杂,要进行处理。代码埋点:收集的用户所有行为更加精准,能够进行更细节的处理。基于上述优缺点以及团队现状,因此采用代码埋点的方式来实现。以下仅介绍关于前端的部分,至于登录次数、登录人数等均可完全靠后端进行实现一、埋点思考运营需求:用户浏览各页面情况(时长等),用户对各个规定元素

vue3+vite+vant项目下按需引入vant报错Failed to resolve import解决方案

在vue3+vite+vant项目下按需引入vant报错Failedtoresolveimport解决方案问题描述在学习vite+vue3+vant开发项目过程中,参考vant官网开发指南->快速上手->引入组件vant组件库官网按照上述配置好后,运行vite环境报错:Failedtoresolveimport原因分析根据报错信息,发现是vant的样式引入路径不对。以Button组件为例程序解析为:项目路径/node_modules/vant/lib/vant/es/button/style实际应该是:项目路径/node_modules/vant/es/button/style多了一个vant

基于Java+SpringBoot+vue前后端分离学生宿舍管理系统设计实现

博主介绍:✌全网粉丝30W+,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌🍅文末获取源码联系🍅👇🏻 精彩专栏推荐订阅👇🏻 不然下次找不到哟2022-2024年最全的计算机软件毕业设计选题大全:1000个热门选题推荐✅Java项目精品实战案例《100套》Java微信小程序项目实战《100套》​ 系统介绍:互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。针对学生宿舍信息管

【vue】Element UIel-dialog 自定义样式 + 去除弹框遮罩层底层可点击

需求点开弹框,右侧键盘按钮还需要可以点击效果如图去除遮罩层+底层内容可编辑点击:modal=“false”+css样式el-dialog:modal="false":close-on-click-modal="false":title="$t('createOrder.cretOrder')":visible="createVisible":before-close="close">el-dialog>//dialog去除遮罩层弹窗底下可点击/deep/.el-dialog__wrapper{pointer-events:none;}/deep/.el-dialog{pointer-event

vue中通过JavaScript实现web端鼠标横向滑动&触控板滑动效果-demo

JavaScript实现web端鼠标横向滑动&触控板滑动效果 支持鼠标拖动滑动&触控板滑动效果web端实现滑动,就是对鼠标按下、鼠标松开、鼠标移动事件进行监听效果图  代码结构代码滑动元素{{num}}样式代码.swiper{.container{width:90%;margin:0auto;display:flex;/*white-space:nowrap;//避免子元素在父元素内换行*/overflow-x:auto;//显示横向滚动条/*scroll-snap-type:xmandatory;//自动吸附*//*scroll-behavior:smooth;//平滑滚动的效果*/.box