pageTools 一个复用的通知条
<template>
<el-card class="page-tools">
<el-row type="flex" align="middle" justify="space-between">
<div>
<el-button
v-if="text"
icon="el-icon-info"
size="small"
type="primary"
plain
>
{{ text }}</el-button
>
</div>
<div>
<slot></slot>
</div>
</el-row>
</el-card>
</template>
<script>
// # region
// 是否有封装过组件呢?
// 有!
// 场景1:功能复用,多个页面都用到某个功能
// 场景2:页面逻辑太多,进行拆分功能(添加/修改独立出去)
// 注意些什么:
// 1. 抽离模板(复用)
// 2. 设计props el-button type/size/
// 3. 设计插槽 el-dialog title 插槽
// # endregion
export default {
name: "PageTools",
props: {
text: {
type: String,
},
},
};
</script>
<style></style>
pageTools 一个复用的通知条的更多相关文章
- Android - 隐藏最顶端的通知条(Top Notification Bar)
隐藏最顶端的通知条(Top Notification Bar/ActionBar) 本文地址: http://blog.csdn.net/caroline_wendy Android中, 视频播放等功 ...
- 开发谷歌浏览器插件会上瘾,搞了一个JSONViewer,一个页面格式化多条JSON,提升工作效率
最近写了一个谷歌浏览器插件(Chrome extension),拿出来分享下,希望能提升大家的工作效率. 一.背景 先说痛点:日常开发中,经常需要不停的把接口输出的JSON拷贝到在线JSON格式化页面 ...
- iOS开发:代码通用性以及其规范 第二篇(猜想iOS中实现TableView内部设计思路(附代码),以类似的思想实现一个通用的进度条)
在iOS开发中,经常是要用到UITableView的,我曾经思考过这样一个问题,为什么任何种类的model放到TableView和所需的cell里面,都可以正常显示?而我自己写的很多view却只是能放 ...
- 20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1
20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1 视频地址: https://www.bilibili.com/video/av39709290/?p=10 博客地址: https ...
- 翻翻git之---一个丰富的通知工具类 NotifyUtil
转载请注明出处王亟亟的大牛之路 P1(废话板块.今天还加了个小广告) 昨天出去浪,到家把麦麦当当放出来玩一会就整到了12点多..早上睡过头了. .简直心酸. ... 近期手头上有一些职位能够操作,然后 ...
- 用初中数学知识撸一个canvas环形进度条
周末好,今天给大家带来一款接地气的环形进度条组件vue-awesome-progress.近日被设计小姐姐要求实现这么一个环形进度条效果,大体由四部分组成,分别是底色圆环,进度弧,环内文字,进度圆点. ...
- 利用CoreAnimation实现一个时间的进度条
(个人原创,转载请注明出处 http://www.cnblogs.com/pretty-guy/p/7460334.html) 在iOS中实现进度条通常都是通过不停的设置progress来完成的,这样 ...
- A、B同时打开一个页面进行同一条数据库记录进行修改,A修改完成后提交表单,A修改的数据保存完成后;当B也修改完成后,提交数据进行数据修改。此时B修改的内容会覆盖A修改的内容,请问如何避免?
A.B同时打开一个页面进行数据中的一条数据进行修改,A修改完成后提交表单,数据修改保存完成后B开始页面也修改完成,开始提交进行修改.此时B修改的内容会覆盖A的内容,请问如何避免? 通过搜索和我个人总结 ...
- Python——一个简单的进度条的实现
import math def process_bar(total_work,work_index,length): times = total_work / length # 长度倍数,用来缩放或扩 ...
- 【CSS】 一个简单的导航条
今天来做一个导航条! 首先写一个坯子: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &quo ...
随机推荐
- docker 部署的mariadb数据库备份还原方案
docker部署下的mariadb数据库备份还原方案 背景:在使用docker部署的mariadb时,我们会将容器内的数据卷挂载到宿主机上,做简单的备份,容器在正常运行和停止的情况下,能快速创建mar ...
- 图像bayer格式介绍
图像bayer格式介绍 https://zhuanlan.zhihu.com/p/72581663
- 个人常用的win7快捷键
1.Win + D – 显示桌面 2.Win+L 锁定系统 3.Win + R – 打开运行窗口 4.Win+M 最小化所有窗口 当按下后当前所有窗口全都最小化.再次按下这个组 ...
- SFINAE几种实现方式
一.通过函数返回值实现 template<class T> typename std::enable_if<std::is_trivially_default_constructib ...
- 洛谷P4802 [CCO 2015]路短最
题目 https://www.luogu.com.cn/problem/P4802 思路 数据范围 \(n\leq 18\),义眼丁真,鉴定为状压. 好,那我们来思考一下状态的构建.其实是很套路的东西 ...
- mac系统yarn使用报错:ERROR: add is not COMMAND nor fully qualified CLASSNAME.
出现错误的过程: mac 系统上使用阿里的X6(@antv/x6) x6 快速上手: 1 npm install @antv/x6 --save 2 yarn add @antv/x6 ...
- JS实现另存/打印功能
代码实现 <div id="main"> <-- 需要保存的内容 --></div> <div @click="printdiv ...
- stm32的boot0和boot1
stm32的boot0和boot1 TM32三种启动模式对应的存储介质均是芯片内置的,它们是: 1)用户闪存 = 芯片内置的Flash.2)SRAM = 芯片内置的RAM区,就是内存啦.3)系统存储器 ...
- 查看linux进程启动运行时间
ps -eo pid,tty,user,lstart,etime,cmd|grep nginx 参数说明: pid:进程ID tty:终端 user:用户 lstart:开始时间 etime:运行时间 ...
- vue3+ts+vant制作音乐播放器(进度条拖拽、倍速切换、上一曲、下一曲)完整版
1.进度条的用的是vant的Progress组件,比手写进度条方便很多,有自带的事件 2.H5页面兼容pc 效果展示 上代码 一.template模块 <template lang=" ...