![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
组件
戴向天
我不是一个优秀的人,但我是一个肯努力的人。
展开
-
Vue3 + TS 关于如何将组件进行挂载body 例如:$message / $notify - 戴向天
大家好!我叫戴向天QQ群:602504799如若有不理解的,可加QQ群进行咨询了解关于messgae 和 notification 的组件内容我就不贴出来了。若想要的就直接加群获取吧。使用方式 this.$message({ message: "这个是$message", }); this.$notify({ message: "这个是$notify", });效果图fileName: main.tsimport { createApp } from 'vu原创 2022-04-12 10:12:38 · 2117 阅读 · 0 评论 -
Vue3 + TS Slider组件,支持上下左右收起 - 戴向天
大家好!我叫戴向天QQ群:602504799如若有不理解的,可加QQ群进行咨询了解Tips: 是在Element-UI的基础上进行更改操作的,原有的Element-UI是不支持方向性的处理,以及动画时间的设定,并且还需要通过CSS进行动画处理,当前改造过的该组件不需要CSS,可以直接进行复制使用。使用方法: <Slider :direction="sliderDirection" :duration="duration" > <div style="wid原创 2022-03-30 11:29:28 · 1457 阅读 · 0 评论 -
element-ui 表单TS封装table-form -戴向天
大家好!我叫戴向天QQ群:602504799如若有不理解的,可加QQ群进行咨询了解<template> <div :class="getClassName()" class="flex-sw-22"> <el-form :label-width="labelWidth" :model="params" ref="form" :rules="rules" > <div class="原创 2021-03-05 17:20:58 · 486 阅读 · 0 评论 -
element-ui table封装信息列表table-list,自动化处理(无需再写过多冗余的方法) - 戴向天
大家好!我叫戴向天QQ群:602504799如若有不理解的,可加QQ群进行咨询了解<template> <div ref="table" :class="getClassName(full ? 'full' : '')"> <el-table style="width:100%" :stripe="true" :class="getClassName('table')" :data="data" :b原创 2021-03-05 17:18:20 · 528 阅读 · 0 评论 -
VUE利用CSS + DIV实现SELECT (简单) -戴向天
大家好!我叫戴向天QQ群:602504799如若有不理解的,可加QQ群进行咨询了解组件内容<template> <div class="select"> <div tabindex="1" @blur="blur">{{value}}</div> <ul> <li v-for="(item,key) in options" :key="key" @mousemove="txt = item">{{原创 2020-06-26 18:28:01 · 814 阅读 · 0 评论 -
实现ElementUI-colorPicker颜色选择器组件 - 戴向天
大家好!我叫戴向天。QQ群:602504799QQ:809002582实现vantUI-colorPicker颜色选择器组件样式代码我就不贴出来了:加群(602504799)可获取样式代码包效果图代码如下<template> <div class="p-20 bg-f width-350 height-240 border-s-e"> <d...原创 2020-01-20 09:54:36 · 4552 阅读 · 0 评论 -
前端 vue v-drag 拖拽面板组件 - 戴向天
大家好!我叫戴向天QQ群:602504799QQ:809002582<template> <div v-drag :class="{'fixed':isFixed}"> <slot/> </div></template><script> export default { props:{ isF...原创 2019-09-25 10:31:06 · 5517 阅读 · 0 评论 -
前端 《优化改良》 - VUE高效开发 - div - 自定义div的load事件 - 戴向天
大家好,我叫戴向天。不说废话了,看代码 ,该说的都下在注释里面了↓↓<template> <div :style="getStyle"> <slot/> </div></template><script> /** * 据之前的开发,由于每次的 宽、高、背景,颜色在公共样式里面时有时无的 ...原创 2019-06-11 16:59:28 · 12714 阅读 · 4 评论 -
前端 vue swipe 轮播 自定组件高效开发 - 戴向天
大家好!我叫戴向天QQ群:602504799QQ:809002582如若有不理解的,可加QQ群进行咨询了解<template> <layout-div :style="getStyle" class="over-h posi-r"> <layout-div :style="getChildStyle" class="flex" @load="lo...原创 2019-06-23 18:30:33 · 11318 阅读 · 0 评论 -
前端 vue组件 layout-button-group - 按钮组 - 高效开发 - 戴向天
大家好!我叫戴向天QQ群:602504799QQ:809002582如若有不理解的,可加QQ群进行咨询了解layout-div 组件详情 》https://blog.csdn.net/weixin_41088946/article/details/91448369layout-image 组件详情》https://blog.csdn.net/weixin_41088946/article...原创 2019-06-25 23:37:01 · 14430 阅读 · 0 评论 -
前端 vue 高效开发 - input-file + 回显 组件封装 - 戴向天
大家好!我叫戴向天QQ群:602504799QQ:809002582如若有不理解的,可加QQ群进行咨询了解dd-layout-div 组件详情 》https://blog.csdn.net/weixin_41088946/article/details/91448369dd-layout-img 组件详情》https://blog.csdn.net/weixin_41088946/art...原创 2019-06-18 10:20:49 · 12335 阅读 · 0 评论 -
前端JS H5 touch事件封装,更加高效的开发移动端 - 戴向天
大家好!我叫戴向天。今天我给大家分享一个我自己封装的H5 touch事件的封装。QQ:809002582该方法的使用特别的简单,废话不多说。先上代码 ↓↓↓↓↓/** 给元素绑定事件 */ function touch({dom, start, move, end, stop = true, change}) { const f = { dat...原创 2019-06-04 10:34:57 · 11740 阅读 · 0 评论 -
前端 利用自定义组件 div 和 封装的touch事件做的刻度 -rule -戴向天
大家好!我加戴向天。QQ:809002582<template> <!--尺子刻度--> <div class="posi-r dh-150 mar-a w-600 over-h" :style="{border:`3px solid ${color}`}"> <div class="posi-a w100 flex-x-cen...原创 2019-06-14 18:12:09 · 489 阅读 · 0 评论 -
前端 自定义 tag组件 VUE高效开发 - tag - 戴向天
大家好!我叫戴向天QQ:809002582tag 组件的内容在手机移动端上面的时候,文字的字体会有向上偏移的情况,所以在在组件方面我没有使用height,而采用了padding,利用padding来进行是文字居中(文字普遍的向上偏移2px)<template> <div v-if="name" v-bind="getParams" @c...原创 2019-06-14 13:35:18 · 14345 阅读 · 0 评论