- 博客(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
168
原创 发送消息 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
269
原创 转场动画:动画效果 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
776
原创 插槽:具名插槽
具名插槽 自定义组件 HomePanel // 哪里需要内容,就在哪里写<slot></slot> <slot name="right"> <!-- 具名插槽:使用template包裹 name --> </slot> <slot> <!-- 默认插槽:在组件使用时,直接写 --> </slot> 使用自定义组件 HomePanel <HomePanel title="新鲜好物"
2022-05-14 22:05:09
147
原创 批量注册全局组件
批量注册自定义组件 vue3 src/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
247
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人