自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(54)
  • 收藏
  • 关注

原创 Dart学习笔记(5)--泛型、库、 async和await、导入pub包管理系统和冲突解决、部分导入和延迟加载、Dart 新特性

01、泛型方法通俗理解:泛型就是解决 类 接口 方法的复用性、以及对不特定数据类型的支持(类型校验)//只能返回string类型的数据 String getData(String value){ return value; } //同时支持返回 string类型 和int类型 (代码冗余) String getData1(String value){ return value; } int getData2(int value)

2022-05-28 15:22:23 361

原创 Dart学习笔记(4)-- 抽象类 多态 接口 一个类实现多个接口 mixins

01、Dart中抽象类Dart中抽象类: Dart抽象类主要用于定义标准,子类可以继承抽象类,也可以实现抽象类接口。 1、抽象类通过abstract 关键字来定义 2、Dart中的抽象方法不能用abstract声明,Dart中没有方法体的方法我们称为抽象方法。 3、如果子类继承抽象类必须得实现里面的抽象方法 4、如果把抽象类当做接口实现的话必须得实现抽象类里面定义的所有属性和方法。 5、抽象类不能被实例化,只有继承它的子类可以extends抽象类 和 implemen

2022-05-28 15:04:23 451

原创 Dart学习笔记(3)-- 对象 类 静态成员 操作符 类的继承

01、对象面向对象编程(OOP)的三个基本特征是:封装、继承、多态 封装:封装是对象和类概念的主要特性。封装,把客观事物封装成抽象的类,并且把自己的部分属性和方法供给其他对象调用, 而一部分属性和方法则隐藏。 继承:面向对象编程 (OOP) 语言的一个主要功能就是“继承”。继承是指这样一种能力:它可以使用现有类的功能,并在无需重新编写原来的类的情况下对这些功能进行扩展。 多态:允许将子类类型的

2022-05-28 14:50:02 211

原创 Dart学习笔记(2)-- 集合类型 List Set Map 函数定义 箭头函数 匿名函数 闭包

01、List,Set,Map里面常用的属性和方法List里面常用的属性和方法: 常用属性: length 长度 reversed 翻转 isEmpty 是否为空 isNotEmpty 是否不为空 常用方法: add 增加 addAll 拼接数组 indexOf 查找 传入具体值

2022-05-28 14:21:38 197

原创 Dart学习笔记(1)--变量,常量,命名规则,数据类型,类型转换 ,运算符, 条件表达式, for while do...while break continue 多维列表

01、Dart 变量 常量 命名规则Dart 变量: dart是一个强大的脚本类语言,可以不预先定义变量类型 ,自动会类型推倒 dart中定义变量可以通过var关键字可以通过类型来申明变量 如: var str='this is var'; String str='this is var'; int str=123; 注意: var 后就不要写类型 , 写了类型 不要var 两者都写 var a int = 5; 报错Dart

2022-05-22 16:07:16 143

原创 vue3.0导入表格通用组件封装

1.安装插件依赖 npm install xlsx -s2.在components文件夹中创建UploadExcel文件夹index.vue内容如下:<template> <div class="upload-excel"> <div class="btn-upload"> <el-button :loading="loading" type="primary" @click="handleUpload"> {

2022-05-15 14:18:26 885

原创 vue+file-saver+xlsx 封装导出Excel表格方法

file-saver+xlsx 封装通用导出方法安装插件依赖npm i xlsx@0.17.0npm i file-saver@2.0.52.在utils文件夹中创建ExportExcel.js文件/* eslint-disable */import { saveAs } from 'file-saver'import XLSX from 'xlsx'function datenum(v, date1904) { if (date1904) v += 1462 var ep

2022-05-15 14:05:06 1353 2

原创 git约定式提交规范

一.Commitizen助你规范化提交代码commitizen 仓库名为 cz-cli ,它提供了一个 git cz 的指令用于代替 git commit,简单一句话介绍它:当你使用 commitizen 进行代码提交(git commit)时,commitizen 会提交你在提交时填写所有必需的提交字段!全局安装Commitizennpm install -g commitizen@4.2.4全局安装Commitizennpm i cz-customizable@6.3.0 --s

2022-05-15 13:31:08 920

原创 为什么toFixed(2)四舍五入保留两位小数,有时候会进位有时不会进位?

为什么toFixed(2)四舍五入保留两位小数,第三位大于等于5时,有时候会进位,有时不会进位问题问题描述在做项目得时候遇到金额得计算,计算出金额之后需要保留两位小数,并且小数的第三位大于等于五需要向小数点的第二位加1(进位),也就是四舍五入。但是遇到了一个奇葩的问题,也就是toFixed(2)有时候 会向前进一,有时候不会,如下:** 这个大于等于五不会进位 **** 这个大于等于五会进位 **得出的结果让我很困惑,于是经过我不断查阅百度和各种论坛终于找到了解决方法: //在需要的

2022-01-19 11:44:09 2882 1

原创 vue 封装一个导出Excel数据的公共函数

vue+element UI 封装一个导出Excel数据的公共函数将公共方法封装在store的modules的common.js中,如下图:代码如下:const download = { actions: { downloadData({ commit, state }, data) { return new Promise((resolve, reject) => { data.event(data.formD

2021-09-28 11:35:18 1401 2

原创 vue-quill-editor富文本的简单使用

基于Vue项目的富文本vue-quill-editor的使用一、背景之前就已经使用过其他的富文本,因为使用的不多,所以很快就忘记了。正所谓好记性不然烂笔头,为了快速开发,节约时间所以简单的做一下笔记。二、二.Vue-Quill-Editor使用1.简介Quill适用于Vue的富文本编辑器,支持服务端渲染和单页应用.不过有一定的兼容性,就是兼容IE10+2.安装-使用npm install vue-quill-editor -S使用:我这里使用的是局部注册,因为使用的不多,所以就不挂载全

2021-07-26 10:27:08 319

原创 Vue 前端页面按钮权限控制

前言按钮权限控制的功能其实在前面的一篇的页面权限管理也包含有这个功能,但是没有凸显出来,所以现在单独写一篇文章用来记录一下一、什么是按钮权限控制?刚刚做完了一个后台管理系统,有用到按钮权限控制,所以记录一下。按钮权限控制就是说对于不同的用户,可操作的按钮是不一样的,比如有些按钮有些用户是看不见,有些用户是可以看得见的。应用场景:用户A能看得到‘新增’按钮,而用户B是看不到‘新增’按钮的二、使用步骤按钮权限控制,我知道的有两种解决方案:1.定义一个全局方法,配合v-if实现(下面会介绍);2.使用

2021-07-23 15:24:00 11638 10

原创 vue-template-admin 页面权限管理

一、前言** 在做后台管理系统的时候有幸搞了一下权限管理的功能,所以记录一下这个流程,我是用的是element 的模板vue-template-admin**二、使用步骤1.登录拦击(1)在src目录下创建权限文件夹(2)然后在main中引入(3)在登录成功之后请求getInfo接口获取用户信息(4)getInfo主要放在vuex的user文件中,里面共有Login,GetInfo,logout等接口。GetInfo获取用户信息并存储用户信息之后,接着GenerateUserRout

2021-07-23 11:37:05 2737

原创 vue 表单校验工具

** 表单检验工具 记录一下**Vuelidate 官网VeeValidate 中文文档-API

2021-07-10 15:58:57 337

原创 vue+Echarts 图表的封装

Echarts图形封装1.子组件的封装<template> <div :id="id" :style="{height:height,width:width}" /></template><script>import resize from '@/mixins/resize'export default { name: 'Chart', mixins: [resize], props: { /

2021-06-30 14:18:15 448 4

原创 vue+element table动态表格的封装

elementUI的动态表格封装,做个笔记,elementUI官网1.在components中创建GlobalTable文件夹,代码如下<template> <div class="c-table"> <!--region 表格--> <el-table id="CTable" ref="CTable" v-loading="loading" empty-text="暂无数据" :h

2021-06-30 12:00:25 771

原创 vue element Pagination分页组件二次封装

vue+element 的分页组件封装1.在components中创建GlobalPagination文件夹,代码如下<template> <div :class="{'hidden':hidden}" class="pagination-container"> <el-pagination :background="background" :current-page.sync="currentPage" :page-size

2021-05-18 11:17:49 438

原创 element Tabs标签二次封装

直接上代码<template> <div class="tab-container"> <el-tabs v-model="activeName" style="margin-top:15px;" :type="tabType" @tab-click="handleClick"> <el-tab-pane v-for="item in tabMapOptions" :key="item.key" :label="item.label" :n

2021-05-18 10:46:52 1640 5

原创 Vue $emit 和 $on的用法

一、$emit1、this $emit(‘自定义事件名’,要传送的数据);2、触发当前实例上的事件,要传递的数据会传给监听器;二、$on1、this.on(′事件名′,callback)callback回调on('事件名',callback) callback回调on(′事件名′,callback)callback回调emit要传送的数据;2、监听当前实例上自定义事件;三、实例<html> <head> <title>$emit 和 $on&l

2021-03-30 16:04:38 7409

原创 class 和 style 绑定的高级用法

class 和 style 绑定的高级用法<html> <head> <title>class 和 style 绑定的高级用法</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="root"> <d

2021-03-30 15:39:52 95

原创 Vue 监听器 watch 多种用法

监听器 watch<html> <head> <title>监听器 watch</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="root"> <h3>Watch 用法1:常见用法</

2021-03-30 15:15:16 155

原创 vue+iview 封装分页组件

vue+iview的分页组件封装1.在components中创建pagination文件夹,接着创建src,index.js,index.less文件2.index.less文件 //需要修改的样式 .ivu-page-options { margin-left: 10px; .ivu-page-options-sizer { margin-right: 0; } }3.index.js文件import "./index.less";import

2020-10-21 18:31:55 629

原创 vue+element 封装动态可配置扩展性强的搜索form表单

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar

2020-10-21 17:57:47 828

原创 git commit提交规范

feat:新增功能(feature)fix:修复补丁(bug)docs:修订文档,如Readme, Change Log, Contribute等refactor:代码重构,未新增任何功能和修复任何bugstyle: 仅调整空格、格式缩进等(不改变代码逻辑的变动)perf:优化相关,改善性能和体验的修改test:测试用例的增加/修改chore:非 src 和 test 的修改merge:合并分支或冲突等revert: 回滚到上一个版本build:改变构建流程,新增依赖库、工具等(例如we

2020-08-25 14:57:24 127

原创 推荐一个vue的组件分享网站--轮子工厂

推荐一个优秀轮子的网站—轮子工厂,一直在持续更新的组件分享网站。这里提供vue和angular的组件,同时还分享一些优秀的组件库。这里的每个组件都有比较详细的安装,使用说明,实例和参数列表等。可以很方便的引入组件到你的应用中使用。网站:轮子工厂...

2020-06-17 18:00:57 1793 4

原创 ES6学习笔记之Promise对象

Promise对象1.异步回调语法不美观我们遇见了回调黑洞问题(一层嵌套一层)回调就是当有多个异步的事情,要排队进行的时候,此时必须回调嵌套回调。ES6推出了Promise对象,就是优雅的解决回调函数的黑洞问题,Promise对象2. ES6的Promise对象ES6 规定,Promise对象是一个构造函数,用来生成Promise实例。下面代码创造了一个Promise实例。cons...

2020-03-08 16:12:02 159

原创 ES6学习笔记之ES6中的模块

一ES6中的模块(CMD规范)1 import和export基本使用重点:在ES6中新增了js文件的暴露和引入的新写法:(import和export) node es6 require() → import exports.*** → export module.exp...

2020-03-08 15:39:16 183

原创 ES6学习笔记之ES6中函数的新特性

一箭头函数ES6 允许使用“箭头”(=>)定义函数:注意:=> 是一个完整的运算符,不能拆开 = >箭头函数一定是匿名函数,要使用“=”赋值接收某一个匿名的箭头函数,来给这个匿名的箭头函数命名。函数的扩展1【function的基本简化】之前定义函数要写function关键字:const sum = function(a , b){ return a + ...

2020-03-08 15:08:44 163

原创 ES6学习笔记之数组的扩展

一、数组的扩展1 find和findIndex方法数组实例的find方法,用于找出第一个符合条件的数组成员,它不会遍历完整的数组。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员,就结束。如果没有符合条件的成员,则返回undefinedvar arr = [2,3,4,5,6,7,8,9,10,11,12];var index =...

2020-03-08 14:26:33 124

原创 ES6学习笔记之对象的扩展,字符串的扩展

一.对象的扩展1.对象属性名表达式ES6可以在JSON中使用[]包裹一个key的名字。此时这个key将用表达式作为属性名(被当做变量求值),这个key值必须是字符串。var a = "name";var obj = { [a] : "小明", "age": 12, "sex":"男"}console.log(obj.name); //小明2 Object.a...

2020-03-07 17:37:35 172

原创 ES6学习笔记之数组方法和纯函数

一、ES6得新增数组方法ES6中对数组新增了四大“金刚”函数:forEach()、map()、filter()、reduce(),都是一些语法糖。forEach()是es5语法1 forEach()遍历数组forEach()方法用来循环遍历数组,方法中的function回调函数接收3个参数第1个是遍历的数组内容(item);第2个是对应的数组索引(index),第3个是数组本身(array...

2020-03-07 15:51:03 665

原创 ES6学习笔记之扩展运算符

一.扩展运算符1.扩展运算符(spread)是三个点(…)。将一个数组转为用逗号分隔的参数序列,还能强制展开一个对象,通常用于对象的赋值,使用灵活广泛。第一个作用:称为“展开运算符”,就是把东西展开,可以用在数组和对象上。var obj1 = { "a" :100, "b" :200, "c" :300,}var obj2 = { ...obj1, ...

2020-03-07 14:17:26 227

原创 ES6学习笔记之const和let,变量的解构

一、const和let1 constconst用来定义常量,所谓的常量就是值一旦给定后就不变,一次定义终身不变的量const a = 10;a = 20;上面的a就是一个常量,若给a重新赋值,你会发现报错了注意:const通常会定义两种东西:l 定义函数l 定义一些特殊的字符串和常数常量名一般都是全大写,如果由多个单词组成,用下划线隔开,暗示这个是常量2 letlet用...

2020-03-07 10:34:55 250

原创 npx创建React项目报错

先来看报错信息然后百度了老半重装了node,npm,都更新了一遍还是不行,最后在在GitHub中找到这样一个评论if you want to use current path that has space in username "C:\Users\Firstname Lastname\AppData\Roaming\npm-cache"you can replace the string...

2020-02-05 16:09:38 717 2

原创 vue prototype 扩展方法

在vue的原型上扩展自己的方法,然后可以全局使用。自己常用的方法有两种混入也是可以全局使用的,但是不能再.js文件中使用,混入请查看混入的使用**方式一1.路径:utils/getTime.js// 倒计时 时间格式化输出,如11天03小时25分钟19秒 每1s都会调用一次function dateformat(micro_second) { // 总秒数 如果传入的是毫秒需要 m...

2020-01-19 10:42:20 1467

原创 vue mixins混入的使用

1.mixins就是混入,就是定义一部分公共的方法或者计算属性,然后混入到各个组件中使用,方便管理与统一修改,mixins是一种分发Vue组件中可复用功能的非常灵活的一种方式一个混入对象可以包含任意组件选项。.比如组件的生命周期,data(){return{}},methods方法等,凡事能在组件上编写的都能在混入2.什么时候使用Mixins页面的风格不用,但是执行的方法和需要的数据类似,这...

2020-01-18 16:29:00 607

原创 vue 自定义通知信息弹窗,全局可用

自定义属于自己的弹窗,并挂载在全局,可在全局使用。适合适用于通知类弹窗,业务逻辑复杂需要与其他组件交互的不推荐使用在src/components文件夹下创建modal文件夹,并创建两个文件分别为:index.js,Modal.vueindex.jsimport Vue from "vue";import Modal from "./Modal.vue";//局部注册 需要传入 co...

2020-01-18 14:48:41 1446

原创 VScode Eslint代码校验

{ "git.ignoreMissingGitWarning": true, "workbench.colorTheme": "Monokai", "workbench.iconTheme": "vscode-icons", // 是否自动保存 // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": fa...

2019-12-29 14:51:29 358

原创 触屏页面移动默认选中设置

在做页面自助收银的时候用户点击按钮,会默认选中两个点之间的区域,还会出现选中的颜色,这对于触屏程序来说是很不友好的,折腾半个小时候找到了一个解决办法,亲测有效。1.使用以下代码,两点之间将不再会默认选中,我把这端css放在APP.vue下,全局有效.disable-select { user-select: none; /* supported by Chrome and Opera */...

2019-12-12 11:17:33 211

原创 Vue3.0 使用mock

Vue CLI 3 环境中使用模拟数据(Mock)第一步:下载mock插件 以及axiosnpm install --save axiosnpm install --save mockjs2.第二步:在根目录下创建mock文件夹,跟src统计,然后在创建mock.js。这是用来存储模拟数据的文件const Mock = require('mockjs') //引入mockMo...

2019-11-29 15:01:34 2309 3

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除