小兔鲜商02

js 复制代码
 npm i @vueuse/core -f

vue插件使用: 许多公用的全局组件,,可以通过插件注册进去,就不用一个一个导入组件,,

js 复制代码
import XtxSkeleton from '@/components/library/xtx-skeleton'

export default {
  install (app) {
    // 导入组件
    app.component(XtxSkeleton.name, XtxSkeleton)
  }
}

使用插件:router,vuex也是插件,,


git checkout . : 已经提交的代码,不想要了,回退


轮播图组件封装: 只封装轮播效果,不管容器大小

具有的功能:

  • 自动轮播
  • 鼠标移入停止轮播,鼠标移出开始轮播
  • 指示器修改
  • next,prev 按钮
  • 销毁组件的时候,清空定时器 onUnmounted钩子
    注意:每次执行autoplay之前,,先将之前的定时器清空,,再重新设置自动轮播的定时器

vue3使用插槽: 插槽名用#名字,,,默认插槽外面不能包裹template标签,否则不显示


vue动画:

进入前显示样式 v-enter-from ,,进入中显示样式v-enter-active ,,进入完成v-enter-to

将要做动画的元素包裹在<Transition>中

如果有多个Transition ,在transition标签加 name属性,, 那么css类名为: 将

v-enter-form 改成 对应name-enter-form :

根据name做不同的动画

相关推荐
theMuseCatcher6 天前
Vue3导航菜单(Menu)
typescript·vue3·less
theMuseCatcher7 天前
Vue3评论(Comment)
typescript·vue3
RuoyiOffice8 天前
Vue3+Gantt:把任务排期、依赖关系和里程碑放进项目管理
项目管理·vue3·springboot·dhtmlx-gantt·wbs·gantt·ruoyi office
AI开源软件10 天前
SpringBoot3+Vue3 财务管理系统如何设计:从业务单据到总账的模块划分
spring boot·vue3·领域建模·会计凭证·ruoyi office·业财协同·财务系统设计
Nymph_Zhu15 天前
vue3+element-plus 文件上传
前端·typescript·vue3·element-plus
Nymph_Zhu15 天前
pdf转换markdown预览及内容互相点击定位
前端·pdf·vue3·markdown·element-plus
AI源码18 天前
巨峰影视影院
vue3
RuoyiOffice18 天前
UniApp企业办公:把审批、客户和项目装进手机,能做些什么?
spring boot·vue3·uniapp·crm·flowable·移动办公·企业应用
RuoyiOffice19 天前
SpringBoot OA推荐:面向信创选型,看看这套企业协同平台
spring boot·vue3·信创·flowable·企业协同·ruoyi office·oa选型
周厉19 天前
WebSocket 使用场景与实现方法:Java + Vue3 全栈实战
java·websocket·vue3·websocket双向通讯