分类学习笔记下的文章 - EN博客

2023-06-03

uniapp uniCloud登陆使用uni-id-co登陆可以在onload中调用，也可以事件调用，不跳转到uni-id-pages提供的页面，使用uniCloud uni-Id登陆。//微信小程序 const uniIdCo = uniCloud.importObject('uni-id-co') uni.login({ provider: 'weixin', success: function(loginRes) { if (loginRes.code) { uniIdCo.loginByWeixin({ code:loginRes.code }).then(res=>{ if(res.errCode == 0){ mutations.updateUserInfo() } }) } }, fail(err) { uni.showModal({ content: err.message || '请求服务失败', showCancel: false }) } });token过期判断let token_expired = uni.getStorageSync('uni_id_token_expired')||0 let currTime = new Date().getTime(); let hostUserInfo = uni.getStorageSync('uni-id-pages-userInfo')||{} // token是否过期 if(token_expired < currTime) hostUserInfo = {} const data = { userInfo: hostUserInfo, hasLogin: Object.keys(hostUserInfo).length != 0 }

2023年06月03日
109 阅读
0 评论
0 点赞

2023-06-01

uniapp+php 微信小程序登录获取openid uniapp+php 微信小程序登录获取openid前端 uni.login（wx.login）获取code后端 jscode2session 验证code并获取openid参考、非完整demouniapp代码：const BASE_URL = "http://127.0.0.1/api/"; //接口地址 /** * 封装请求 */ export const myRequest = (options)=>{ return new Promise((resolve,rejecj)=>{ uni.request({ url:BASE_URL + options.url, method:options.method || 'GET', data:options.data || {}, dataType:"json", header: { "Content-Type": "application/x-www-form-urlencoded", }, success: (res) => { resolve(res) }, fail: (err) => { uni.showToast({ title:'请求接口失败', icon:"error" }) rejecj(err) } }) }) } /** * 微信小程序登录并获取用户信息 */ export const wxlogin = ()=>{ return new Promise((resolve,rejecj)=>{ uni.login({ provider: 'weixin', //使用微信登录 success: function (loginRes) { if(loginRes.code){ let data = {code:loginRes.code}; myRequest({ url:"api.php?act=getWxInfo", data, method:"POST" }).then(res=>{ resolve(res) }).catch(err=>{ rejecj(err) }); } },fail(err) { rejecj(err) } }); }) }php代码：接收到code后获取openid /** * jscode2session * 通过 wx.login 接口获得临时登录凭证 code 后传到开发者服务器调用此接口完成登录流程 * https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/user-login/code2Session.html */ public function jscode2session($code = ""){ $api = "https://api.weixin.qq.com/sns/jscode2session?appid={$this->appid}&secret={$this->secret}&js_code={$code}&grant_type=authorization_code"; $reslut = file_get_contents($api); $reslut_arr = json_decode($reslut,true); if(!is_array($reslut_arr)){ return ['errcode' => -9999,'errmsg' => $reslut]; } return $reslut_arr; }

2023年06月01日
114 阅读
0 评论
0 点赞

2023-03-21

Driver.js页面着重,新手引导,用户互交引导插件+案例 Driver.js 是一个强大的，轻量级，使用原生js引擎开发的库，用于在页面聚焦用户的关注点。它支持所有主流浏览器，并且可高度自定义。使用简单，配置方便。用户互交，新手引导利器Vue//安装 npm install driver.js //引入 import Driver from 'driver.js'; import 'driver.js/dist/driver.min.css'; //挂载 Vue.prototype.$driver = new Driver();html中直接引入<link rel="stylesheet" href="/dist/driver.min.css"> <script src="/dist/driver.min.js"></script>html实例代码（vue同理）<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://unpkg.com/driver.js/dist/driver.min.js"></script> <link rel="stylesheet" href="https://unpkg.com/driver.js/dist/driver.min.css"> <title>driver</title> <style> .box-1{ width: 100px; height: 100px; background-color: #1aa094; display: inline-block; } .box-2{ width: 200px; height: 200px; background-color: #FF6347; float: right; } .box-3{ margin-top: 400px; background-color: #00a2d4; float: right; } /* * 隐藏引导中的关闭按钮，必须到最后一步才能关闭 */ div#driver-popover-item .driver-popover-footer button{ display: none; } </style> </head> <body> <div class="box-1" > 1 </div> <div class="box-2"> 2 </div> <button class="box-3" onclick="javascript:driver.start();"> 重新引导 </button> <script> const driver = new Driver({ allowClose: false, // 是否点击遮罩关闭 overlayClickNext: false, //是否允许点击遮罩时移到到下一步 doneBtnText: "我知道了", // 最终按钮上的文本, 最后一步按钮文案 closeBtnText: "跳过", // 默认的关闭按钮文案 nextBtnText: "下一步", // 默认的下一步按钮文案 prevBtnText: "上一步", // 默认的上一步按钮文案 overlayClickNext: true, padding: 10, // 边距 //showButtons: false, // 不显示控制按钮 keyboardControl: true, // 是否允许通过键盘的左右键来控制 // 在元素即将突出显示时调用 onHighlightStarted:(e)=>{ // console.log("onHighlightStarted 即将突出显示 (每一步都会执行)",e) // $(".driver-close-btn").style({display:'none'}); }, // 当元素完全突出显示时调用 onHighlighted:(e)=>{ //console.log("onHighlighted 完全突出显示 (每一步都会执行)",e) }, // 覆盖即将清除时调用 onReset: (e)=>{ console.log("onReset 关闭",e) if(driver.hasNextStep()){ console.log("验证是否有下一步",driver.hasNextStep()) return false; } }, // 在任何步骤转到下一步时调用 onNext:(e)=>{ console.log("onNext",e) }, // 在任何步骤转到上一步时调用 onPrevious:(e)=>{ //如果没有上一步，阻止执行 if(!driver.hasPreviousStep()){ console.log("验证是否有上一步",driver.hasPreviousStep()) driver.preventMove();// 阻止当前移动 return; } console.log("onPrevious",e) } }); /* driver.highlight({ element: '.box-1', popover: { title: 'Did you know?', description: 'You can add HTML in title or description also!', } }); */ const steps = [ { element: '.box-1', popover: { title: "第一步", description: '这是one', //position: 'top', //位置，可选值： left, left-center, left-bottom, top, top-center, top-right, right, right-center, right-bottom, bottom, bottom-center, bottom-right, mid-center opacity: 0.1, animate: true, closeBtnText: '关闭提示', nextBtnText: 'next->', prevBtnText: '<-prev', } }, { element: '.box-2', popover: { title: "第二步", description: '这是two', position: 'left' } }, { element: '.box-3', popover: { title: "第三步", description: '这是three', //position: 'bottom' } } ]; driver.defineSteps(steps) driver.start() </script> </body> </html>

2023年03月21日
984 阅读
0 评论
1 点赞

2023-03-20

vue报错收集(vueui连接已断开,npm安装依赖报错,npm运行项目报错) 创建vue项目时，遇到的一些问题。使用版本{dotted startColor="#ff6c6c" endColor="#1989fa"/}1.使用vue ui创建项目时，出现‘连接已断开’执行命令 vue ui报错 undefined:2[0x7FFB8005B2D0] ANOMALY: meaningless REX prefix used解决方案进入项目的文件目录，按住 shift ，在空白处点击鼠标右键，选择在此处打开PowerShell ,执行 vue ui2.安装依赖时报错执行命令 npm i vue@3.2.8 vue-router@4.0.11 vuex@4.0.2 npm i报错npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving解决方案在命令后加 --legacy-peer-deps例如： npm i vue@3.2.8 vue-router@4.0.11 vuex@4.0.2 --legacy-peer-deps3.运行报错执行命令 npm run serve报错 Error: Cannot find module ‘vue/compiler-sfc‘解决方案执行 npm i vue-loader@15 -D 如果报错执行 npm i vue-loader@15 --legacy-peer-deps （理由如上）

2023年03月20日
704 阅读
0 评论
0 点赞

2023-03-02

composer安装扩展包与常用命令 1.安装composer官方源： composer config -g repo.packagist composer https://packagist.phpcomposer.com 阿里云源： composer config repo.packagist composer https://mirrors.aliyun.com/composer/ 腾讯云源： composer config -g repos.packagist composer https://mirrors.cloud.tencent.com/composer/2.常用命令查看composer版本 composer -v 升级composer版本 composer self-update composer从2版本降到1版本composer self-update 1.10.24 或者 composer self-update --1更新但不自动升级到更高版本 composer update --no-plugins 查看composer 的配置 composer config -g -l 修改composer 的镜像源 composer config -g repo.packagist composer https://mirrors.cloud.tencent.com/composer/composer 比较常用的镜像源composer官方 https://packagist.orgphp官方 https://packagist.phpcomposer.com阿里云 https://mirrors.aliyun.com/composer腾讯云 https://mirrors.cloud.tencent.com/composer华为云 https://mirrors.huaweicloud.com/repository/phplaravel(中国) https://packagist.laravel-china.org显示所有的扩展包composer show -i 查看关联包 composer why 命名空间/包名例如： composer why symfony/deprecation-contracts 移除包 composer remove 命名空间/包名例如： composer remove symfony/deprecation-contracts 安装某个扩展包 composer require 命名空间/包名例如： composer require symfony/deprecation-contracts3.常见问题1、更新composer出现版本不匹配，插件丢失等问题的解决方法：删除composer.lock 文件，删除vendor目录里的全部文件重新执行composer install --ignore-platform-reqs 或者 composer update --ignore-platform-reqs--ignore-platform-reqs 这个是忽略php版本匹配的意思{dotted startColor="#ff6c6c" endColor="#1989fa"/}转自：https://blog.csdn.net/qq15577969/article/details/126687778

2023年03月02日
592 阅读
1 评论
0 点赞

2023-02-02

vue在html中的使用 vue在html中的使用。<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script> <style> .active{ color: red; } </style> <div id="app"> {{ message }} <hr> <span :class="{ active: isActive }">{{count}} 是 1 吗？{{ count == 1 ? 'Yes' : 'No' }}</span> <hr> <span>当前时间：{{nows}}</span> <br> <span>{{fullName}} ( {{firstName}} {{lastName}} )</span> <br> <span>{{languageBooksLength}}</span> <hr> <ul> <li v-for="(item, index) in languageBooks"> {{ index }} - {{ item }} </li> </ul> <span v-for="item of languageBooks">{{ item }} , </span> <hr> <h1 v-if="awesome">Vue is awesome!</h1>

2023年02月02日
106 阅读
0 评论
0 点赞

2022-12-23

2022年12月23日
67 阅读
0 评论
0 点赞

2022-12-23

2022年12月23日
79 阅读
0 评论
0 点赞

$html简约大气好看的公告\通知模板源码$ 2022-12-08

2022年12月08日
92 阅读
0 评论
0 点赞

2022-10-25

typescript 面向对象 typescript面向对象test1 定义：对象属性方法 test2 构造函数与this的使用test3 类的继承与super的使用test4 抽象类abstract定义与继承test5 接口（interface）与实现接口test6 属性的修饰符与get/settest7 泛型包含ts文件与编译后的js文件{cloud title="ts面向对象" type="default" url="https://pan.quark.cn/s/9c38345aec97" password=""/}

2022年10月25日
139 阅读
0 评论
0 点赞