- 博客(5)
- 收藏
- 关注
原创 自定义指令 图片懒加载 vue3
自定义指令export default { install (app) { // 自定义指令 // <img :src="" /> // <img v-lazy="" /> // 图片懒加载 app.directive('lazy', { // el v-lazy所在dom binding.value是指定的值 mounted (el, { value }) { // 参数一:回调函数 1. en
2022-05-19 23:46:41
131
原创 发送消息 message postMessage window.addEventListenter(‘message‘,()=>{})
向iframe发送消息<iframe :src="iframeSrc2" ref="ERRORiframe" allowfullscreen:"true" frameborder="no"></iframe>发送消息const text = JSON.stringfy(text) // 需要传递的数据this.$nextTick(()=>{ // 在iframe打开之后发送消息 const Frame = this.$refs['ERRORiframe'] if
2022-05-17 21:45:17
204
原创 转场动画:动画效果 css 动画 animate.css
实现动画的方式<template> <button @click="show = !show">改变</button> <!-- 1..css 1.使用transition组件包裹组件 2.会自动在适当的时机,给元素加上6个类名 进入: v-enter-from : 进入前 v-enter-to : 进入后 v-enter-active : 整个进入的过程
2022-05-16 23:20:40
641
原创 插槽:具名插槽
具名插槽自定义组件 HomePanel// 哪里需要内容,就在哪里写<slot></slot> <slot name="right"> <!-- 具名插槽:使用template包裹 name --> </slot> <slot> <!-- 默认插槽:在组件使用时,直接写 --> </slot>使用自定义组件 HomePanel<HomePanel title="新鲜好物"
2022-05-14 22:05:09
106
原创 批量注册全局组件
批量注册自定义组件 vue3src/components/index.js// import XtxSkeleton from './xtx-skeleton'// import XtxCarousel from './xtx-carousel'// import XtxMore from './xtx-more.vue'// export default {// install (app) {// // 全局注册组件// app.component(XtxSkeleto
2022-05-14 21:12:28
209
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人