- 博客(27)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 使用element-ui组件做出块状多选框效果
先上效果图：主要使用element-ui中的“Checkbox 多选框”组件Checkbox 多选框<div class="inner-drawer-content-container"> <el-checkbox-group v-model="chosenTypes"> <el-checkbox v-for="(item, index) in intentionTypes" :label="item" :key="index" border size="
2022-02-23 15:15:09
1337
原创 Vue源码分析
Vue源码分析数据代理1. 数据代理数据代理是通过一个对象代理对另一个对象中属性的操作（读/写）。Vue中的数据代理是通过vm对象来代理data对象中所有属性的操作。优点是能够更方便的操作data中的数据2. 基本实现流程通过Object.defineProperty()给vm添加与data对象的属性对应的属性描述符。所有添加的属性都包含getter/setter。getter/setter内部去操作data中对应的属性数据。模板解析1. 模板解析的基本流程将el的所有子节点取
2021-07-14 16:58:55
243
原创 Vue源码分析的准备知识
Vue源码分析准备知识1. 将类数组对象转化为数组<ul> <li>test1</li> <li>test2</li> <li>test3</li></ul>const lis = document.getElementsByTagName('li')console.log(lis instanceof Array, lis.forEach)const lis2 = Array.from(l
2021-05-19 20:56:19
244
原创 基于 Cookie/Session 的认证方案
基于 Cookie/Session 的认证方案CookieCookie 的工作原理由于 HTTP 是一种无状态的协议，服务器单从网络连接上无从知道客户身份。怎么办呢？就给客户端们颁发一个通行证吧，每人一个，无论谁访问都必须携带自己通行证。这样服务器就能从通行证上确认客户身份了。这就是。cookie 指的就是在浏览器里面存储的一种数据，仅仅是浏览器实现的一种数据存储功能。cookie 的保存时间，可以自己在程序中设置。如果没有设置保存时间，应该是一关闭浏览器，cookie 就自动消失。Cookie 实
2021-04-29 10:34:13
1145
原创 auto_route: Flutter自动路由注册插件
auto_route: Flutter自动路由注册插件pub.dev地址：https://pub.dev/packages/auto_route新建dart文件在router/route_map中注册直接在@CustomAutoRouter注解中添加AutoRoute(page:类名)执行命令动态刷新路由表flutter packages pub run build_runner watch使用XRouter方法访问路由Xrouter.push(Routes.类名);
2021-04-27 10:09:20
1752
原创 你应该知道的 18 个 Git 命令
你应该知道的 18 个 Git 命令简介毫无疑问，Git是用于跟踪源代码更改的最流行的版本控制系统。git的创始人是Linus Torvalds，同时他也是Linux的创始人。前提要求为了能够进行后续操作，你需要一个git终端或安装了git的bash shell。Git配置在初始化新的git仓库或开始提交之前，应先配置git身份。为了更改与提交关联的name，你可以使用git config命令：git config --global user.name "Your Name"同样，这也
2021-04-22 15:49:17
190
原创 Flutter使用高德地图获取定位
Flutter使用高德地图获取定位Github地址：高德定位Flutter插件具体配置项可查阅官方说明文档1. 初始化变量Map<String, Object> _locationResult;StreamSubscription<Map<String, Object>> _locationListener;AmapLocationFlutterPlugin _locationPlugin = new AmapLocationFlutterPlugin();
2021-01-11 18:35:25
2608
1
原创 解决Flutter打包后permission_handler失效问题
因为项目需要用到定位、相机、麦克风权限，所以调用了permission_handler库来实现。但是在正常调试时没有出现任何问题，能够弹出获取权限的对话框也能够正常获取各项权限；而使用命令flutter build apk后打包生成的release版本中没有弹出获取权限的对话框也不会获取权限。在CSDN、知乎和SegmentFault都发布了问题但是无果最后决定自己解决，终于在官方GitHub的Issues版块找到了有同样问题的小伙伴。Dont work Permission_handler in
2020-11-19 14:38:27
2557
原创 Flutter踩坑日记
GradleException报红解决方法：将GradleException改为Exceptionandroid\app\build.gradleif (flutterRoot == null) { // throw new GradleException("Flutter SDK not found. Define location with flutter.sdk in the local.properties file.") throw new Exception("Flutte
2020-11-04 23:28:54
560
原创 Flutter开发笔记
Flutter开发笔记1. 目录结构文件夹作用androidAndroid平台相关代码iosiOS平台相关代码libFlutter相关代码，我们主要编写的代码就在这个文件夹test用于存放测试代码pubspec.yaml配置文件，一般存放第三方库的依赖2. 入口文件和入口方法每一个flutter项目的lib目录里都有一个main.dart入口文件引入material.dartimport 'package:flutter/material
2020-11-03 20:32:12
225
原创 Flutter Android替换闪屏图片和打包
1. Flutter Android闪屏图片替换先将图片放在\android\app\src\main\res\drawable\路径下然后修改\android\app\src\main\res\drawable\launch_background.xml<!-- You can insert your own image assets here --><item> <bitmap android:gravity="fill" android:src
2020-11-02 11:53:54
328
原创 Dart抽象类, 多态, 接口, 泛型和库
抽象类Dart抽象类主要用于定义标准，子类可以继承抽象类，也可以实现抽象类接口抽象类通过abstract关键字来定义Dart中的抽象方法不能用abstract声明，Dart中没有方法体的方法我们称为抽象方法。如果子类继承抽象类必须得实现里面的全部抽象方法如果把抽象类当做接口实现的话必须得实现抽象类里面定义的所有属性和方法。抽象类不能被实例化，只有继承它的子类可以extends抽象类和implements的区别:如果要复用抽象类里面的方法，并且要用抽象方法约束自类的话我们就用extend
2020-10-20 22:11:42
324
原创 Dart函数、类和对象
函数1. 内置方法2. 自定义方法自定义方法基本格式返回类型 方法名称(参数1, 参数2, ...) { 方法体; return 返回值;}返回类型可以省略3. 箭头函数箭头后只能写一行代码List myList = [1, 5, 6, 9];var newList = myList.map((e) => e > 5 ? e * 2 : e).toList();print(newList); // 输出结果：[1, 5, 12, 18]4. 闭包
2020-10-19 22:22:59
444
原创 Dart中的List, Set和Map
1. List常用属性属性功能length长度reversed倒序排序isEmpty是否为空isNotEmpty是否不为空常用方法List fruits = ['香蕉', '苹果', '西瓜'];1. 增加add: 增加一个fruits.add('桃子');addAll: 拼接数组（增加多个）fruits.addAll(['葡萄', '梨']);2. 查找indexOf: 若查找成功则返回索引值，否则返回-1print(frui
2020-10-13 19:21:09
506
原创 Dart基础和语法
Dart基本语法1. 主方法main() {}// 无返回值void main() {}2. 注释同JavaScript: // ; /* */ ; ///3. 变量Dart是一个强大的脚本类语言，可以不预先定义变量类型通过var定义自动推断类型的变量var str = 'dart';var myNum = 1234;定义指定类型变量String str = 'dart';int myNum = 1234;Dart变量命名规则：变量名称必须由数字、字母、下划线和美
2020-10-13 16:30:48
1457
原创 vue-element-admin修改登录及权限验证
理清了整个的登录逻辑就能轻松的修改，登录逻辑参考：vue-element-admin登录逻辑，以及动态添加路由，显示侧边栏本文是结合项目实际而做1. 角色的分配除登录等基本页面，一共还有7个页面共有三种角色：超级管理员administrator：能够访问所有页面管理员admin：能够访问管理员的三个页面和主页代理agent：能够访问代理的三个页面和主页管理员和代理都无法访问对方的页面2. 登录逻辑原本的逻辑是：点击按钮后触发点击事件 -> 事件中分发store.action -
2020-09-21 22:36:19
9439
原创 新版本vue-element-admin调用后端接口和跨域
1. vue-element-admin版本{ "name": "vue-element-admin", "version": "4.4.0", ...}2. 修改.env.development将VUE_APP_BASE_API中内容改为空# just a flagENV = 'development'# base apiVUE_APP_BASE_API = ''3. 修改vue.config.js移除mock// before: require('./mock/m
2020-09-18 21:43:26
3989
6
原创 Vue复制到剪贴板：vue-clipboard2
1. 安装vue-clipboard2npm install --save vue-clipboard22. main.jsimport VueClipboard from "vue-clipboard2";VueClipboard.config.autoSetContainer = trueVue.use(VueClipboard)3. 在标签中使用<el-button type="text" v-clipboard:copy="value" v-clipboard:s
2020-09-17 20:16:50
255
原创 el-pagination分页组件纯前端分页使用方法
el-pagination在表格中用法el-table<el-table :data="tableData.slice((currentPage - 1) * pagesize, currentPage * pagesize)"> ...</el-table>el-pagination<div> <el-pagination background @current-change="handleCurrentChang
2020-09-17 10:51:32
21882
7
原创 vue-element-admin修改浏览器中标题
@\src\utils\get-page-title.js:const title = defaultSettings.title || '新标题'@\src\settings.js:title: '新标题'
2020-09-15 20:05:12
616
1
原创 Vuex笔记: 通过实例学习Vuex用法
一、配置Vuex安装Vuexnpm install --save vuex创建Vuex核心管理对象模块创建store.js，一般置于目录@/src/下// vuex的核心管理对象模块import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex);// 状态对象const state = {};// 包含多个更新state函数的对象const mutations = {};// 包含多个对应事件回调函数的对象const
2020-08-08 11:19:34
229
原创 Vue自定义div窗口拖拽指令v-drag
在需要拖拽的标签中添加指令v-drag：v-drag在<script>部分中directives部分代码：directives: { elDragDialog, drag(el){ let oDiv = el; //当前元素 let self = this; //上下文 //禁止选择网页上的文字 document.onselectstart = function() { return false; }; oDiv.onmousedown = functi
2020-08-05 15:26:30
1495
3
原创 Vue组件间通信和路由
1. 组件间通信1：标签属性组件间通信的基本原则：不要在子组件中直接修改父组件的状态数据；数据在哪个组件, 更新数据的行为（方法或函数）就应该定义在哪个组件当中。当一个组件要接受标签属性首先要声明接受属性。props的三种声明方式：props:['comment']这种方式只指定了属性名。props:{ comment:Object}这种方式指定了属性名和类型。props: { comment: { type: Object, required: true
2020-08-02 18:42:20
354
原创 Vue中需要注意的地方
1. ESlintESlint 是一个代码规范检查工具，它定义了很多特定的规则, 一旦你的代码违背了某一规则, ESlint 会作出非常有用的提示。ESlint提供以下支持：ES, JSX, style检查以及自定义错误和提示。2. 组件化编码的基本流程拆分组件实现静态组件实现动态组件动态组件的实现还主要包括实现初始化显示和动态交互功能。此外还要对在编码时所使用的数据确定数据名称，定义数据的类型。同时还要分析对于这个数据是某一个组件需要还是某些组件需要。3. 组件间通信：标签属性
2020-08-02 18:20:45
158
原创 Vue进阶和vue-cli配置
一、Vue基础语法部分1. 事件处理绑定监听v-on:xxx="fun"@xxx="fun"@xxx="fun(参数)"默认事件形参: event隐含属性对象: $eventhtml部分代码：<h2>1.绑定监听</h2><button @click="test1">test1</button><button @click="test2('atguigu')">test2</button><butto
2020-08-02 16:54:57
191
原创 Vue基础和语法
1. Vue的基本认识和基本使用引入vue.js创建Vue对象双向数据绑定: v-modelel: 指定根element(选择器)data: 初始化数据(页面可以访问)显示数据: {{xxx}}理解vue的mvvm实现MVVM:model: 模型, 数据对象(data)view: 视图, 模板页面viewModel: 视图模型(Vue的实例)2. 模板语法：强制数据绑定 绑定事件监听指令一：强制数据绑定<img v-bind:src="imgUr
2020-08-02 16:10:50
121
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人