小兔鲜商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做不同的动画

相关推荐
雨季mo浅忆5 天前
首个Vue3项目边写边学边记
前端·vue3
#麻辣小龙虾#6 天前
基于vue3.0开发一款【固废与废气运维管理系统】(支持源码)
前端·vue.js·vue3
SL-staff9 天前
Vue3私有化AI白板落地实战|解决政企项目智能绘图合规难题(可直接复用源码)
人工智能·低代码·开源·vue3·白板·jvs规则引擎·jvs-draw
雨季mo浅忆9 天前
Cursor快速实现上传Excel功能
前端·vue3·ai编程
ANnianStriver11 天前
PetLumina-AI 驱动的宠物生活管理平台
java·生活·vue3·springboot·ai编程·宠物·全栈开发
雨季mo浅忆12 天前
记录Vue3项目中的各类问题
前端·bug·vue3
八目蛛15 天前
八目蛛网络(免费工具网站导航)
css·vue.js·开源·vue3·html5·ai编程
颂love15 天前
Vue3基础入门
前端·学习·vue3
海市公约16 天前
Vue3组合式API中watch传值生命周期与自定义Hook实战
vue3·生命周期·watch·props·组件通信·defineexpose·自定义hook
海市公约17 天前
Vue3组合式API与响应式系统核心机制详解
vue3·computed·reactive·ref·响应式系统·composition api·script setup