aaron9185的博客

原创 递归 --获取层级树目标节点及其上层节点

目标，通过传入id，获取到目标点id及其上层节点。返回数组，包含从顶级节点到目标节点所有层级的id。1、层级结构2、代码function getCodingByPage (menus, page, selList) { for(let i = 0; i<menus.length; i++) { selList.push(menus[i].id) if(menus[i]['id'] == page)

原创 网页使用rem前设置字体

//rem.js文件export default (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth; if (!cli...

原创 生成VNode对象

需求：使用vxe-table替换antd表格，实现表格拖拽功能。问题：文档上一个函数返回了一个数组，里面是HTML代码。第一次遇见这种格式。就这样吧能运行就好。然后写完DEMO在向项目中移植的时候发现报错。tableColumn: [ { width: 60, slots: { default: () => { return [ <span class="drag-btn">

原创 VUE 子组件样式不生效问题 -- scoped CSS穿透 (＞＞＞ || /deep/)

需求：vue项目中引入了vxe-grid插件，设置class后不生效。<div class="wrap-container"> <vxe-grid row-key ref="xTable2" class="sortable-tree-demo" :scroll-y="{enabled: false}" :columns="tableColumn" :data="tableTreeD

原创 npm发版报错(404)

解决方法：使用了npm淘宝镜像导致连接不上https://registry.npmjs.org。修改.npmrc文件内容为registry=http://registry.npmjs.org/。再次发版即可通过。问题：方法：1、修改.npmrc，地址2、地址修改为3、一个查询.npmrc地址的方法npm config ls -l...

原创 小程序API封装成支持Promise的API

封装代码/** * 将小程序的API封装成支持Promise的API * @params fn {Function} 小程序原始API，如wx.login */public wxPromisify: Function = fn => { return function (obj = {}) { return new Promise((resolve, reject) => { obj.success = function (res) { .

原创 vue-video-player 进度条不能调节BUG

问题：使用vue-video-player组件播放视频，视频进度条不能点击不能拖动。点击或者拖动就会重新从头开始播放。产生原因：其实就是没有转成字节流，导致不能选择某个视频点解决方式使用nginx进行转发参考文章：https://blog.youkuaiyun.com/weixin_43616097/article/details/106342909...

原创 vue中--父组件调用子组件方法 ref实现 + ts内使用报错问题(断言解决)

开篇：最近需要编写一个组件互相传递消息，首先是父组件调用子组件方法并传值，在网上找到ref可以实现那么开始搞。vue ref 调用子组件的方法(原生)定义子组件son.vue组件内定义方法methods:{ showToast(msg){ console.log(msg) }}父组件引入子组件，并声明ref父组件里面的方法通过ref执行子组件的方法<template> <view> <..

转载 promise使用讲解

promise是什么？1、主要用于异步计算2、可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果3、可以在对象之间传递和操作promise，帮助我们处理队列为什么会有promise？为了避免界面冻结（任务） 同步：假设你去了一家饭店，找个位置，叫来服务员，这个时候服务员对你说，对不起我是“同步”服务员，我要服务完这张桌子才能招呼你。那桌客人明明已经吃上了，你只是想要个菜单，这么小的动作，服务员却要你等到别人的一个大动作完成之后，才能再来招呼你，这个便是同步的问题：也就是“顺序

转载 vue中使用async和await来实现同步和异步

用async/await 来处理异步近期项目中大量使用async，从服务器获取数据，解决一些并发传参问题。代码很简单。在此也看了一些博客，现在async/await已经大范围让使用，是时候总结一波啦。先说一下async的语法，它作为一个关键字放在函数前面，用于表示函数是一个异步函数，因为async就是异步的异步，异步函数也就是意味着这个函数的执行不会阻塞后面代码的执行。简单的写一个async函数async function hello(){ return 'hello world';}

原创 mpvue项目--书架读书

技术选型开发框架mpvue 组件库 小程序vant 支付宝 mini-antui 服务端nodejs 其他核心库 mpvue-router-path vuex flyio微信小程序入门点我直接看教程吧vue.js入门点我直接看教程吧API接口地址和设计图http://www.youbaobao.xyz...

原创 VUE实现商城系统

产品预览

原创 VUE搭建课程首页

环境搭建配置环境app.vue页面改动<template> <div id="app"> <!-- 隐藏 --> <!-- <img src="./assets/logo.png"> --> <router-view/> </div></template><script>export default { name: 'App'}</s

原创 网页开发基础--Vue

Sass基础Sass整体介绍Sass是一种CSS扩展语言，同时Sass也是一种CSS预处理工具Sass官网：http://www.sass-lang.com/Sass中文网：https://www.sass.hk/CSS预处理工具我们需要一些类似CSS的前置文件，通过对这些前置文件的编译与解析，最终生成浏览器可识别的CSS文件常见的CSS预处理工具有：Sass、less、stylus，三者在语法、编译环境、工具库上都有异同和各自优劣之处Sass工作流程.sass文件与

原创 网页开发基础--ES6

ES6基础入门之let、const变量声明var声明var name='hiyori'直接使用window.location.href===location.href说明：这种不加var声明的定义方式，相当于在全局对象window上挂了一个属性，会造成全局对象污染，不建议这么做let和var的主要区别let声明的变量只在当前（块级）作用域内有效 let声明的变量不能被重复声明 let不存在变量提升ES6之前的作用域全局作用域、函数作用域、eval作用域块级.

原创 网页开发基础--jQuery

@[TOC](文章目录)#123#456#789#99999

原创 JS实现轮播图特效

原创 JavaScript BOM常用方法

什么是BOMDOM是一套操作HTML标签的API（接口/方法/属性）BOM是一套操作浏览器的API（接口/方法/属性）常见的BOM对象window：代表整个浏览器窗口（window是BOM中的一个对象，并且是顶级的对象）Navigator ：代表浏览器当前的信息，通过Navigator我们可以获取用户当前使用的是什么浏览器Location： 代表浏览器当前的地址信息，通过Location我们可以获取或者设置当前的地址信息History：代表浏览器的历史信息，通过History我们可以实现上

原创 js 事件常用方法

一、介绍 事件是用来实现js和html之间交互的，可以用侦听器（或处理程序）来预订事件，以便事件发生时执行相应的代码。这种在传统软件工程中被称为观察员模式的模型，支持页面的行为（js）与页面的外观（html和css）的松散耦合。事件最早是在IE3和Netscape Navigator2中出现的，当时是作为分担服务器运算负载的一种手段。二、事件流 事件流描述的是从页面中接收事件的顺序。IE的事件流是事件冒泡流，而Netscape Communicator 的事件流是事件捕获流。1、...

原创 JS DOM属性节点操作

操作属性节点有两种当时，一种是通过普通对象的方式来操作属性节点，另外一种是通过属性节点的方法来操作属性节点。1. 元素节点.属性或元素节点[属性]如果我们可以把元素节点当成普通对象来处理，通过 元素节点.属性 或 元素节点[属性] 的方式来设置属性。注意：设置类 class 只能用 className1.1 获取属性var img = document.getElementsByTagName('img')[0];var box = document.getElementsByCla

原创 JS DOM操作节点(查找、操作、删除节点)及节点事件

一、查找节点getElementsById()getElementsByName()getElementsByTagName()getElementsByClassName()querySelector()querySelectorAll()1、通过指定的 id 属性获取节点对象var e = document.getElementsById(id);如果一个页面的ID属性不是唯一的，则返回第一个ID对应的节点对象。在操作文档的一个特定的元素时，最好给该元素一个

原创 JS DOM遍历节点

一、节点类型 节点类型 属性nodeType返回值 元素节点 1 属性节点 2 文本节点 3 注释节点（comment） 8 document 9 DocumentFragment 11 ...

原创 JS DOM创建节点

一、JS DOM创建节点document.write() 可以向文档中添加节点但是有个致命问题，会把文档原有的节点全部清空因此不推荐使用

原创 JS基础之Date对象方法整理

new Date()getFullYear()getMonth()getDate()getHours()getMinutes()getSeconds()getDay()getTime()1、创建事件对象var now = new Date(); //不传参情况下默认返回当前时间2、获取年var y=now.getFullYear();3、获取月var m=now.getMonth()+1;//返回0-114、获取日var d= now.getDat.

原创 JS基础之Math函数的常用方法

Math是数学函数，但又属于对象数据类型typeof Math=> ‘object’console.dir(Math)查看Math的所有函数方法。Math.abs()Math.ceil() and Math.floor()Math.round() 四舍五入 Math.random() 取[0,1)的随机小数 Math.max() and Max.min() Math.PIMath.pow() and Math.sqrt()1，Math.abs()获取绝对值Ma...

原创 JS基础之字符串方法整理

javascript 对字符串的常用操作方法大全：chatAt() charCodeAt()fromCharCode()indexOf()lastIndexOf()concat()match()replace()search()slice()split()substr()substring()toUpperCase() toLowerCase() 1、charAt() --- 创建副本 返回字符串中指定位置的字符let str = 'dengZiYao';..

原创 JS基础之数组方法整理

join()push()和pop()shift() 和 unshift()sort()reverse()concat()slice()splice()indexOf()和 lastIndexOf() （ES5新增）forEach() （ES5新增）map() （ES5新增）filter() （ES5新增）every() （ES5新增）some() （ES5新增）1、join() join，就是把数组转换成字符串，然后给他规定个连接字符，默认的是逗号( ，)　...

转载 display:table和display:table-cell实现多行文本垂直居中

<div class="parent"> <p class="son">会议认为，党的十八大以来，我国经济发展取得历史性成就、 发生历史性变革，为其他领域改革发展提供了重要物质条件。经济实力 再上新台阶，经济年均增长7.1%，成为世界经济增长的主要动力源和稳定器。 </p></div>.parent { display: table; width: 300px; height: 300px; ...

原创 TP5 专题、分类、商品详情接口编写

一、专题接口编写 目录//控制器<?phpnamespace app\api\controller\v1;use app\api\validate\IDCollection;use app\api\model\Theme as ThemeModel;use app\api\validate\IDMustBePostiveInt;use app\lib...

原创 TP5 关系模型

一、一对多//创建模型Banner 一对多关联 BannerItem表 外联表外键 主表主键<?phpnamespace app\api\model;use think\Model;class Banner extends Model{ public function items(){ return $this -> hasMa...

原创 TP5 ORM模型操作数据库

一、直接操作数据库//控制器 banner<?phpnamespace app\api\controller\v1;use app\api\validate\IDMustBePostiveInt;use app\api\model\Banner as BannerModel;use app\lib\exception\BannerMissException;use t...

原创 TP5 日志系统

一、改变日志记录位置//public的index.php中改变日志保存路径<?php// [ 应用入口文件 ]// 定义应用目录define('APP_PATH', __DIR__ . '/../application/');//自定义日志位置 覆盖原来日志位置define('LOG_PATH', __DIR__ . '/../log/');// 加载框架引导文件...

原创 tp5中异常处理 Exception

一、固有思维模式 目录结构//banner控制器<?phpnamespace app\api\controller\v1;use app\api\validate\IDMustBePostiveInt;use app\api\model\Banner as BannerModel;use think\Exception;class Banner...

原创 RESTFul API最佳实践

SOAP VS RESTSOAP 重 采用XML表述数据 REST 轻 采用JSON表述数据 无状态 (链接打开数据库，然后查询新增，还要关闭数据库，不是无状态。无状态是你每次请求都会拿到你的结果)TESTFul API 基于资源，增删改查都只是对于资源状态的改变 使用HTTP动词来操作资源 ...

原创 TP5 Validate自定义验证层 + 构建接口参数验证层

一、自定义验证层 目录结构 IDMustBePostiveInt 参数必须是正整数 参数验证层<?phpnamespace app\api\validate;use think\Validate;class IDMustBePostiveInt extends Validate{ protected $rule...

原创 tp5学习(一) 自定义控制器多级目录 + Validate

知识点总结一、Banner接口定义及自定义控制器多级目录访问route.pp<?phpuse think\Route;Route::rule('getbanner', 'api/v1.Banner/getbanner');

原创 TP5 + 小程序全栈准备工作

工具：Xampp、thinkphp5.07、phpstorm、Xdebug(这个配置好了一直不能使用，求高手解答)、postMan、navicat准备一、配置tp框架 框架放入htdocs，改名为zerg，核心框架移动到zerg内二、配置虚拟域名 apache\conf\extra\httpd-vhosts.conf <Virtua...

原创 wx.navigateBack返回上一级调用上个页面方法

aaa: function(e) { var that = this var pages = getCurrentPages() var beforePage = pages[pages.length - 2]; beforePage.nac_aaa(e.currentTarget.d...

转载 ios设备new Date('2019-07-26 11:00:00')报错

ios设备不支持日期是这种写法：2019-07-26，只支持这种：2019/07/26所以如果日期是后台返回的，格式没法改的话，兼容写法可以这样：new Date('2019-07-26 11:00:00'.replace(/-/g, '/'))...

转载 微信小程序在返回上个页面时，刷新前上页数据

在B页面中进行操作的时候就在后台刷新A页面，当返回A页面的时候就不需要再刷新加载A页面了：具体步骤分为两步：（1）。在父页面中添加刷新数据的方法：changeData:function(){ this.onLoad();//最好是只写需要刷新的区域的代码，onload也可，效率低，有点low}（2）。在子页面中添加方法：并且在需要的地方进行调用（如success方法中s...