<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. VS2017创建Linux项目实现远程GDB调试

    vs2017新增linux for C++的模块,尝试安装了一下环境. 首先,安装VS2017,安装时注意选择以下模块: 安装完成后,需要配置Linux服务端的部分,我的配置过程如下: 第一步,安装V ...

  2. bottle库上传文件

    安装bottle库 pip install bottle 上传代码 import bottle @bottle.get('/upload') def upload_get(): return bott ...

  3. SQL Server 机器学习服务-概述与实战(转)

    原帖地址:https://d-bi.gitee.io/sqlserver-ml-services/ 新年第一篇,去旧迎新.本文内容,既旧也新.旧之处在于,SQL Server 机器学习服务是微软在SQ ...

  4. 记一次对peer的理解

    今天在使用react-native开发项目的时候,想要使用async-storage. 我用的rn版本是18.2.0,不带async-storage,所以我需要自己安装下载. 于是执行命令: npm ...

  5. Vue 局部过滤器和全局过滤器

    Vue 过滤器总结: 定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理) 语法: 1.注册过滤器: Vue.filter(name,callback) 或 new Vue{filt ...

  6. R8051_simulation

    1 下载 git clone https://github.com/risclite/R8051.git 2 编辑文件 mkdir work && mv sim tb flist .. ...

  7. 【FPGA学习】根据datasheet编写Verilog驱动(PCF8574 IO扩展板练习)

    在之间的博客中已经讲了如何阅读一本datasheet并编写Verilog驱动代码,而在这篇博客中就加以应用,为PCF8574 IO扩展板编写驱动并观察效果,至于为什么选择这个,一方面是因为这个芯片功能 ...

  8. SHR之员工合同解除

    员工合同解除HRContractInfoFacadeControllerBean 这块的意思的源码可以自行翻阅该源码. 调用员工的实现这个合同自动解除 String sql="select ...

  9. window stm32 mcu 调试

    1.ARM内核的MCU开发和调试 1.通过keil + jlink(segger) 进行调试 2.通过arm-gdb+openocd+jlink调试 3.通过jtag 进行调试(电路不复杂,硬件只需要 ...

  10. Node Sass version 7.0.1 is incompatible with ^4.0.0 node-sass 问题

    执行旧版项目安装依赖时报错 卸载 npm uninstall node-sass sass-loader 安装(need Python27) npm install sass-loader@7.3.1 ...