vue前端开发笔记4 - 组件按需引入 按需引入的优势：缩小打包之后的文件体积安装插件npm install babel-plugin-component -D修改配置文件 ( babel.config.js )module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], "plugins": [ [ "component", { "libraryName": "element-ui", "styleLibraryName": "theme-chalk" } ] ] } 修改引入import {Button} from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.use(Button);如图：

vue前端开发笔记3 - 安装elementUI 此次安装基于vue2安装element-UInpm i element-ui -S在mian.js中引入UIimport ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI);如图：使用element-ui组件<template> <div class="hello"> <h1>{{ msg }}</h1> <el-row> <el-button>默认按钮</el-button> <el-button type="primary">主要按钮</el-button> <el-button type="success">成功按钮</el-button> <el-button type="info">信息按钮</el-button> <el-button type="warning">警告按钮</el-button> <el-button type="danger">危险按钮</el-button> </el-row> </div> </template>如图：

vue前端开发笔记2 - 创建项目 创建项目1.在终端执行 vue create demo 2.选择vue版本 vue2 或 vue3 3.创建成功运行项目切换到项目的目录 cd demo 运行项目 npm run serve报错解决错误： error:0308010C:digital envelope routines::unsupported解决： export NODE_OPTIONS=--openssl-legacy-provider 或更换node版本产生原因： *V17版本中最近发布的OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制，可能会对生态系统造成一些影响.在node.js V17以前一些可以正常运行的的应用程序,但是在 V17 版本可能会抛出异常*

vue前端开发笔记1 - 安装与配置 环境检查下载地址 https://nodejs.org/en/#download检查版本 node -v npm -v 重新安装 (安装到全局，从npm获取最新版本安装)npm install npm -g 卸载 npm uninstall查看/设置 当前仓库源npm config get registry 临时使用 npm --registry https://registry.npm.taobao.org install express 永久使用 npm config set registry https://registry.npm.taobao.org 或者 npm config set registry https://registry.npm.taobao.org -global 或者 npm use taobao 强制清理npm的缓存 npm cache clear --force安装cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org 查看版本 cpnm -v vue -V yarn

LayuiTable导出所有数据，无需修改后端代码 layui table自带的导出功能仅导出单页的数据，搜索一番之后发现大部分都是通过另外发送ajax请求，让后端进行处理，或是生成excel下载链接，或是后端返回所有数据然后用table.exportFile导出。其实可以利用render，设置limit为总数量实现数据重新加载并导出。方法可行，并不推荐。var tableDataCount = 0; table.render({ elem: '#datatab' ,url: '...数据接口' ,skin:'line' ,even:true ,method:'post' ,limit:20 ,title:'数据' ,height:'full-60' // ,size:'lg' ,cols: [[ {field:'id', width:80, title: 'ID', sort: true}, {field:'name',minWidth:'100', title: '姓名'}, ]] ,page: true , done: function(res, curr, count){ tableDataCount = count;//记录所有数据数量 } }); //在html中设置一个导出全部的按钮，事件： table.reload('datatab',{ page: 1, limit:tableDataCount //加载所有数据 ,where: {where} ,done:function (){ //导出所有数据 table.exportFile("datatab",false,"xls"); //恢复数据分页显示 table.reload('datatab',{ page: 1, limit:20 ,where: {where} ,done:function (res, curr, count){ tableDataCount = count; } }) } })

生成文字头像(图片)PHP代码，根据姓名昵称生成专属头像 添加用户之后，根据用户名或者姓名的首个字符生成默认的头像，如图： /** * 生成默认头像 ay * @param $text * @return false|string */ public static function createAvatar($text = "阿"){ $randBg = [ ['31','38','35'], ['199','210','212'], ['34','162','195'], ['27','167','132'], ['236','43','36'], ['222','118','34'] ]; $bg = $randBg[ array_rand($randBg)]; //随机获取背景 $image = imagecreate(200,200); //创建画布 $color = imagecolorallocate($image,$bg[0],$bg[1],$bg[2]); //为画布分配颜色 imagefilledrectangle($image, 0, 0, 199, 199, $color); //填充颜色到背景 $fontSize = 90; //字体大小 $font_file = public_path('static/common/fonts')."FZDeSHJW_506L.TTF"; //字体文件 * 修改成自己的字体路径 $pos = ImageTTFBBox($fontSize,0,$font_file,$text);// 计算字符的宽高 获得字体初始的8个相对位置 // 居中公式 （画布宽 - 字体的宽度）/ 2 - 字体初始位置的偏移量 $left_x = intval((200 - abs($pos[2] - $pos[0])) / 2 - abs($pos[0])); $left_y = intval((200 - abs($pos[5] - $pos[3])) / 2 + abs($pos[5])); $color2 = imagecolorallocate($image,255,255,255); //为字体分配颜色 imagefttext($image,$fontSize,0,$left_x,$left_y,$color2,$font_file,$text); //填充文案到画布里 $fileName = 'Avatar_'.time().'.png'; //文件名称,避免重复生成 $localFilePath = public_path('static/tmp/avatar').$fileName;//本地存储路径 * 修改成自己存放文件的路径 imagepng($image,$localFilePath);//生成图像并保持本地 if(file_exists($localFilePath)){ return '/static/tmp/avatar/'.$fileName; }else{ return null; } }

thinkphp6 异常处理Exception,自定义异常处理，错误页面 {mtitle title="自定义异常捕获"/}{ } 在 app 下创建 BaseException.php 文件，继承 Exception { } 在 app 下的 ExceptionHandle.php 文件中，添加该异常机制处理逻辑{ } 在控制器中抛出异常{ } 运行结果{dotted startColor="#ff6c6c" endColor="#1989fa"/}{mtitle title="异常处理接管"/}{ } 在 app/admin/ 下创建 exception 文件夹，并创建 Error.php 文件{ } 在 app/admin/ 下创建 provider.php 文件，绑定自定义异常处理handle类{ } 在 admin 应用下的异常都有 Error.php 处理{ } 测试结果{dotted startColor="#ff6c6c" endColor="#1989fa"/}{mtitle title="自定义错误页面"/}{ } 在 app/tpl 下创建模版文件 think_exception_error.tpl { } 在 config/app.php 中配置模版文件路径{ } 在 Base.php 中创建 error() 方法{ } 在 Index.php 控制器中继承 Base 并使用 error() 方法{ } 执行结果

thinkphp6 前置/后置中间件以及使用 在下方的执行结果中可以看到，前置中间件和后置中间件的执行顺序： 前置中间件 - 控制器方法代码 - 后置中间件 - 控制器方法return { } 在 admin/Index/index 方法中写入： { } 在中间件 Check 中写入： { } 执行结果：{dotted startColor="#ff6c6c" endColor="#1989fa"/}1.前置中间件中的 $request 不能获取控制器和方法名，但是可以通过 pathinfo 获取2.后置中间件可以通过 $request->controller(); 获取控制器名称， $request->action(); 获取方法名称

thinkphp6 中间件的介绍与基本使用 中间件是什么？中间件主要用于拦截或过滤应用的HTTP请求，并进行必要的业务处理可以看成是 数据访问过程中的拦截器 。比如可以在控制器处理之前，先验证token是否过期，是否正确等。1.创建中间件可以手动创建，也可以使用命令创建中间件php think make:middleware Check2.注册全局中间件全局中间件在 app 目录下面 middleware.php 文件中定义访问任何一个控制器都会先执行这个中间件3.在控制器中单独注册中间件只有访问 Index 控制器时，才会执行这个中间件。访问 其他 控制器不会执行{message type="warning" content="如果在全局中间件中注册了这个控制器，又在控制器中注册了，那么中间件会执行2次"/}4.在路由中注册中间件在 route/app.php 中编辑路由，注册中间件那么在访问这个路由时，会执行此中间件

文件名批量转换为小写工具(附源码) 工作需要，易语言写的一个小工具。可以将某个文件夹内的文件（包含子文件夹）都转换成小写，输出到一个新的文件夹。不影响原文件。{cloud title="文件名批量转换小写工具" type="lz" url="https://0en.lanzouq.com/i73Hc06z400b" password=""/}