<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 一个复用的通知条的更多相关文章

  1. Android - 隐藏最顶端的通知条(Top Notification Bar)

    隐藏最顶端的通知条(Top Notification Bar/ActionBar) 本文地址: http://blog.csdn.net/caroline_wendy Android中, 视频播放等功 ...

  2. 开发谷歌浏览器插件会上瘾,搞了一个JSONViewer,一个页面格式化多条JSON,提升工作效率

    最近写了一个谷歌浏览器插件(Chrome extension),拿出来分享下,希望能提升大家的工作效率. 一.背景 先说痛点:日常开发中,经常需要不停的把接口输出的JSON拷贝到在线JSON格式化页面 ...

  3. iOS开发:代码通用性以及其规范 第二篇(猜想iOS中实现TableView内部设计思路(附代码),以类似的思想实现一个通用的进度条)

    在iOS开发中,经常是要用到UITableView的,我曾经思考过这样一个问题,为什么任何种类的model放到TableView和所需的cell里面,都可以正常显示?而我自己写的很多view却只是能放 ...

  4. 20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1

    20个Flutter实例视频教程-第10节: 一个不简单的搜索条-1 视频地址: https://www.bilibili.com/video/av39709290/?p=10 博客地址: https ...

  5. 翻翻git之---一个丰富的通知工具类 NotifyUtil

    转载请注明出处王亟亟的大牛之路 P1(废话板块.今天还加了个小广告) 昨天出去浪,到家把麦麦当当放出来玩一会就整到了12点多..早上睡过头了. .简直心酸. ... 近期手头上有一些职位能够操作,然后 ...

  6. 用初中数学知识撸一个canvas环形进度条

    周末好,今天给大家带来一款接地气的环形进度条组件vue-awesome-progress.近日被设计小姐姐要求实现这么一个环形进度条效果,大体由四部分组成,分别是底色圆环,进度弧,环内文字,进度圆点. ...

  7. 利用CoreAnimation实现一个时间的进度条

    (个人原创,转载请注明出处 http://www.cnblogs.com/pretty-guy/p/7460334.html) 在iOS中实现进度条通常都是通过不停的设置progress来完成的,这样 ...

  8. A、B同时打开一个页面进行同一条数据库记录进行修改,A修改完成后提交表单,A修改的数据保存完成后;当B也修改完成后,提交数据进行数据修改。此时B修改的内容会覆盖A修改的内容,请问如何避免?

    A.B同时打开一个页面进行数据中的一条数据进行修改,A修改完成后提交表单,数据修改保存完成后B开始页面也修改完成,开始提交进行修改.此时B修改的内容会覆盖A的内容,请问如何避免? 通过搜索和我个人总结 ...

  9. Python——一个简单的进度条的实现

    import math def process_bar(total_work,work_index,length): times = total_work / length # 长度倍数,用来缩放或扩 ...

  10. 【CSS】 一个简单的导航条

    今天来做一个导航条! 首先写一个坯子: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &quo ...

随机推荐

  1. 记D365开发的最佳实践

    前端JS 不同的需求应该划分模块,以便日后修改,也是为了职责分离,模块分离,日后如果想分离到单独的JS文件里面也是比较方便: 对于公共的查询函数,应该做缓存,优先使用sessionStorage. 多 ...

  2. 3.Linux安装docker

    Docker作为一个软件集装箱化平台,可以让开发者构建应用程序时,将它与其依赖环境一起打包到一个容器中,然后很容易地发布和应用到任意平台中. 进入docker官网找到安装文档 https://docs ...

  3. Codeforces Round #694 (Div. 1) - B. Strange Definition

    数论 Problem - B - Codeforces 题意 给定 \(n\;(1<=n<=3*10^5)\) 个数 \(a[i]\), \(1<=a[i]<=10^6\) 把 ...

  4. yolov4 编译

    参考教程:https://blog.csdn.net/weixin_45102257/article/details/108872951 问题: ![image](https://img2022.cn ...

  5. 记一次SpringBoot整合Redis的Bug

    SpringBoot整合Redis遇见的坑 <!--Redis配置开始--> <dependency> <groupId>org.springframework.b ...

  6. 时钟频率(HZ)与数据传输速率(bit/s)的关系-转载

    (24条消息) 时钟频率(HZ)与数据传输速率(bit/s)的关系_子曰小玖的博客-CSDN博客_速率和频率的关系 时钟频率(HZ)与数据传输速率(bit/s)两者是相同的概念.举例:IIC传输位速率 ...

  7. WDA学习(18):UI Element:TabStrip使用

    1.11 UI Element:Tabstrip使用 本实例显示UI Element:Tabstrip的使用. 1.创建Component; 2.选择Layout页签,设置页面: 创建UI Eleme ...

  8. vscode - plug - scss转css

    vscode - plug - scss转css 参考资料 sass笔记(完结)安装,使用,vscode中设置easy sass,嵌套,变量,混合,循环,分支 vscode配置 easy sass E ...

  9. How to find WWN and WWPN of HBA card in Linux

    There are several ways to detect the WWN of a Fibre Channel (FC) HBA and their details in Linux/Unix ...

  10. holiday06-英语语法-语序和五种基本句式

    第六天 英语五种基本句式: 基本句式一:S V (主+谓) 基本句式二:S V P (主+系+表) 基本句式三:S V O (主+谓+宾) 基本句式四:S V o O(主+谓+间宾+直宾) 基本句式五 ...