码小白的求学之路-CSDN博客

原创微信小程序上传图片及文件（上传、下载、删除及预览）

微信小程序上传附件上传文件及图片下载，预览、删除自定义封装组件哪儿用哪儿调用即可wxml代码<view class="fileImgAll"> <view class="imginfo" style="border-bottom:{{attachmentImgFile&&attachmentImgFile.length!==0?'1px

2021-11-22 14:15:48 2631

原创计算时间，显示具体时间

// 计算时间 timeFn = () => { const { item } = this.props; // const dateBegin = new Date(ti.replace(/-/g, "/"));// 将-转化为/，使用new Date const dateEnd = new Date(item.c_endtime);// 获取当前时间 const dateBegin = new Date(item.c_starttime);// 获取当前时间.

2021-06-15 12:53:55 466 1

原创 react显示文件内存大小

显示文件内存大小直接拿去用 // 显示文件内存大小设置 conver = (limit) => { let size = ""; if (limit < 0.1 * 1024) { // 如果小于0.1KB转化成B size = `${limit.toFixed(2)}B`; } else if (limit < 0.1 * 1024 * 1024) {// 如果小于0.1MB转化成KB size = `${(limit /

2021-06-02 17:02:06 415

原创企业微信群聊消息优化版---三层嵌套（数组加对象）

会话管理 - 群聊消息优化版/** * @文件描述会话管理界面右侧 ---- 群聊二级页面 * @创建人和时间闫宵娜 - 2021-04-21 * @更新人和时间闫宵娜 - 2021-05-6 * @param {Array} modalBox - 包装modul的开关按钮和父页面获取的item数据 * @param {Array} visible - 控制modul的打开关闭 * @param {Array} data - 获取父页面传过来的item数据 * @para

2021-06-02 15:55:06 244 1

原创文件消息类型请求MP3，MP4，docx，zip等文件流（包括添加loading，文件大小展示）

/** * @文件描述会话管理界面右侧 ---- 文件消息 * @创建人和时间 * @param {object} maxed - 视频音频跳转modul使用 * */import React, { PureComponent } from 'react';import { Row, Col, Card, Spin } from 'antd';import { YoutubeOutlined, SoundOutlined, FolderOpenOutlined, FileUnknown

2021-05-11 17:46:36 195

原创员工管理二级会话页面原版

/** * @文件描述会话记录页面 - Tab会话记录 * @创建人和时间闫宵娜 - 2021-03-19 * @更新人和时间闫宵娜 - 2021-03-22 * @param {object} list - 列表字段 * @param {object} params - 获取id字段 * * */import React, { PureComponent } from 'react';// import { Map, Marker } from 'react-amap';im

2021-05-07 16:08:54 105

原创如何获取文件流 - 优化版

// 文件流的多此一举请求 componentDidMount() { const that = this; fetch('http://172.16.20.202/api/v1/wechat/content/13/media', { method: 'GET', responseType: 'blob', }) .then(res => { console.log(res,89); return re..

2021-05-07 08:48:33 322

原创 react如何请求amr文件流接口-优化版

import React, { PureComponent } from 'react';import BenzAMRRecorder from 'benz-amr-recorder';import { Col, Row } from 'antd';import { PlayCircleOutlined, PauseCircleOutlined } from '@ant-design/icons';import amrCeshi from "../../../../assets/audio/amrC

2021-05-06 19:01:24 467

原创企业微信群聊消息react如何做

/** * @文件描述会话管理界面右侧 ---- 群聊二级页面 * @创建人和时间闫宵娜 - 2021-04-21 * @更新人和时间闫宵娜 - 2021-03-22 * @param {Array} list - 列表字段 * */import React, { PureComponent } from 'react';import { Row, Col, Card, Modal } from 'antd';import { renderConI } from './ren.

2021-05-06 18:58:35 247

原创 react如何实现子传父

我们都知道react是单向传递，所以我们碰到父传子之后还需子传父这种情况该怎么办嘞？这个时候我们其实可以先让父级页面传一个函数给子级页面，同时父组件的函数里面再携带一个参数，然后子级页面接收这个函数，并且在此函数内将想传给父级页面的参数放进去让我们来看看代码是如何操作的我这个是想把子级页面的formRef传给父页面父组件父组件先定义个对象，为了把子组件的formRef给父组件；可以是对象，也可以是值，视情况而定@ getRightForm ----这就是要传给子组件的函数import C

2021-04-28 18:57:10 4882

原创 Form表单的Select搜索框如何获取接口数据并渲染页面

我做的这个是企业微信上的（聊天消息）类型搜索想要实现搜索内容并渲染页面，必须得给后端返回一个类型的字段，（你可以问一下你们后端要的是什么字段）我这里是msg_type这个字段当然渲染接口是已经取好了的，这个搜索框不用再重复取这个是子页面，用来渲染聊天的页面，@ item - 是通过父页面传过来的@ conntentType - 也是从父页面传过来的，就是为了左侧的是个接口的，也是为了方便区分，如果你的接口就一个的话，你可以把这个函数直接换成接口函数就好，并且传值给后端@

2021-04-25 20:04:54 942

原创企业微信通过传给后端id来获取页码pagenation

// 获取--群-----客户群-- && -- 内部群 --右侧export async function groupsTest(id,params) { const response = request(`${v1}/wechat/groups/${id}/contents?${stringify(params)}`); return checkCode(response)}models/wechat.jsimport { message } from 'antd';

2021-04-22 20:06:42 140

原创企业微信会话点击每一个item，渲染聊天内容

首先父组件要获取聊天接口，通过id获取(先在servers/api/wechat.js组件中获取接口)import request from 'utils/request';import { stringify } from 'qs';import { wechatV1 as v1, checkCode } from '../config';// -------------------会话页面----------------------------------------------------

2021-04-22 19:55:49 435

原创 React中使用class组件做antd中的排版操作--编辑

import React, { PureComponent} from 'react';import { Typography } from 'antd';import { HighlightOutlined } from '@ant-design/icons';const { Paragraph } = Typography;export default class Right extends PureComponent { constructor(props){ super(props)

2021-04-15 18:23:12 388

原创 React的antd新增vudio操作

首先终端下载 yarn add video-react//引入import { Player } from 'video-react';import "../../../../../node_modules/video-react/dist/video-react.css";接下来 constructor(props) { super(props); this.state = { inputVideoUrl: 'https://media.w3.org/2010/0

2021-04-08 18:09:10 517

原创 react使用dva对数据做GET或POST请求

react使用dva对数据做GET或POST请求首先在组件页面 index.js 中添加componentDidMount(){const { dispatch } =this.props;dispatch({ //type里的menu是models/menus.js里面的命名空间namespace的menu type:'menu/fetchMenus', payload:{}, callback:res=>{ console.log(res,111);},});

2021-03-25 18:39:29 999

原创修改webpack的配置，vue的组件及使用，模板语法，指令事件对象，事件修饰符

0021. 修改webpack 的配置官网打开 Vue CLI目录结构 src ：开发时编写代码的位置 main.js 入口文件App.vue 首屏加载的页面如果需要修改webpack的配置，需要在项目根目录下创建 vue.config.js 具体的配置参考：https://cli.vuejs.org/zh/config/2. vue的组件 1. 组件是以 .vue 结尾的 2. 组件的结构： <template><template&gt

2020-11-14 19:27:57 224

原创 Vue的环境搭建及安装过程

0011.Vue框架创建项目:1. 先搭建webpack环境或在老项目中进行2. 整个项目都是vue,使用脚手架搭建开发环境安装脚手架： npm install -g @vue/cli初始化项目命令：vue create project步骤：第一步, vue create 后会出现至少3个选项，（第一个选项是默认安装vue2,babel,eslint第二个选项是默认安装 vue3，babel,eslint第三个选项 (Manually select features) 自

2020-11-11 20:03:04 1623 13

原创微信小程序 ---基础小项目

index.wxml界面<view class="navBar"> <scroll-view class="nav"

2020-09-27 21:53:49 180

原创 018Day----获取网易云音乐的数据

一，创建文件样式如下：走一步创建一步二，先写html界面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <!--

2020-09-22 21:59:29 367

原创三阶段--017Day 模块 Requirejs

一，主要内容什么是模块化为什么使用模块化模块嵌套Requirejs使用1.1 模块化产生模板就是实现特定功能的一组方法只要把不同的函数（以及记录状态的变量）简单地放在一起，就算是一个模块。1.2为什么使用模块化模块的优点• 可维护性。因为模块是独立的，一个设计良好的模块会让外面的代码对自己的依赖越少越好，这样自己就可以独立去更新和改进。• 命名空间。在 JavaScript 里面，如果一个变量在最顶级的函数之外声明，它就直接变成全局可用。因此，常常不小心出现命名冲突的情况。使用

2020-09-21 22:00:52 256

原创三阶段07Day----音乐--视频/音频--api--js

.音乐–视频/音频音频视频api–js.音乐音频视频api–js <audio src='' autoplay controls></audio> <video ></video> 常用属性: autoplay 自动播放 controls 显示控件 currentTime 返回当前音频/视频的播放时间 duration 返回当前音频/视频的总时长 ended 返回当前音频/视频是否播放结束 paused 暂停状态暂停 true

2020-09-08 20:26:47 96

原创三阶段PHP：02Day-数据库操作-sql语句（插入、修改、删除、查询），前后端连接操作数据-原生form表单登录操作、jquery-ajax登录

回顾：PHP:客户端与服务器端项目流程：需求文档（项目经理-产品经理） --（技术总监）-- 交互设计师ue – ui设计师 – 前端工程师 --后端工程师 —测试人员-- 发布（后端人员） – 运维人员前端岗位：1.技术总监 2.产品经理 3.测试 4.讲师通信协议 + 域名 +端口号（网页请求的端口号：80 8080）Php文件创建命名变量 $变量名=‘’字符串 “”‘’ .预定义变量 $_GET[‘’] $_POST[]输出方式：echo 只能简单数据

2020-09-01 21:01:37 383

原创三阶段-PHP:001Day-客户端、服务器、通信过程，PHP语法-文件创建、数据类型、数组、form表单默认事件控件，数据库、连接数据库

三阶段内容网络请求（前后端交互）小程序三阶段内容：php语言+mysqlAjax（重点一周）移动端 (2天)H5 （存储 canvas 音频视频）图表工具 echartsNode.jsEs6模块化小程序（5-6）软件：记事 Hubilder submit nodepad++ webstorm vscode第一节网络知识1.1 客户端服务器客户端：就是用户使用的平台（手机电脑）服务端：为客户端提供服务的平台静态网站：数据不更改的（数据）动态

2020-08-31 20:33:12 261

原创 020Day-算法、JSON、面向对象、通过构造函数创建对象

一、算法-二分搜索法二分搜索法：折半查找法。binarysearch。作用：做内容查找。功能类似于数组的实例方法：indexOf 时间复杂度 O(n)通常binarysearch用于查找数组元素的索引。找到返回索引，否则返回-1.时间复杂度：O(lg(2n))使用该算法的前提：数列必须是有序的。<script> function random(min, max) { return ~~(Math.random () * (max - min) + min);

2020-08-30 22:11:09 227

原创 019Day-正则、算法

一、正则的分组正则的分组：1: 可以将正则的一部分或者是整体使用小括号括起来，作为一组存在。组可以作为一个整体去进行匹配，可以加数量词。2：正则的分组中可以有多个备选方案，使用| 代表或者的意思。3：正则中的分组，每一组都有一个组号，组号从1开始。组和组之间是可以嵌套的。组号是根据向右的小括号的顺序号来确定的。可以根据 RegExp 的静态变量 $+组号的方法来获得对应组匹配到的内容。一定要先调用test，然后再获得组对应的匹配的内容。分组最大的意义：根据分组来获得不同组号匹配的子串的内

2020-08-30 22:01:15 164

原创 018Day-函数对象的方法、void在超链接中的应用、引入正则表达式、split方法、replace方法、match方法、search方法

一、函数对象的方法重点：this:关键字：代表了当前对象。a：在事件使用。代表了当前正在触发执行事件函数的元素对象。b：全局定义的函数中，或者全局作用域下的this代表了当前window对象。如下的的代码中，两个对象的属性和功能都是不共享的，属性不共享是我们希望的，如果功能一样其实可以共享，实现内存的节约。如何让一个对象的功能共享给其他对象。实现的思路：让某一个对象的功能借用给其他的对象，通过隐式修改功能内的this 来实现方法的借用。函数对象的三个方法的介绍：call、apply、bin

2020-08-30 21:49:22 182

原创 017Day-服务器收到请求信息之后的处理、window对象属性、三级联动练习、页面请求到最终加载显示的过程说明、js的默认加载顺序、js的异步加载、js的懒加载、页面性能优化

一、服务器收到请求信息之后的处理<form action="4.ok.html"> 用户名：<input type="text" name="uname"> <br> 密码：<input type="password" name="pwd"> <br> 手机号：<input type="number" name="phone"> <br> <button>

2020-08-30 21:34:56 259

原创 016Day-移动端事件、BOM、windows对象常用方法、定时器方法、计时牌练习

一、移动端事件介绍<style> div{ width: 300px; height: 300px; background-color: red; } </style></head><body><div></div><script> var div = document.querySelecto

2020-08-30 21:09:15 225

原创 015Day-表单事件、焦点获得失去练习、单选-复选-下拉列表change事件、表单事件、键盘事件、滚动事件、文档事件、文档加载练习、事件委托

一、表单事件-focus-blur重点：表单事件：onfocus：表单元素获得焦点事件。当表单元素获得焦点的时候被触发。onblur：表单元素失去焦点事件。当表单元素失去焦点的时候被触发。注意：当当前的焦点从一个元素移动到另外一个元素，那么上一个获得焦点的元素会先触发失去焦点事件，然后下一个元素才触发获得焦点事件。用户名：<input type="text" id="ipt1"><span></span><br><input type

2020-08-30 20:12:53 281

原创 014Day-事件对象的捕获、事件对象的各种属性、取消默认右键菜单行为、自定义菜单练习、四方向移动小球练习、鼠标拖动元素练习、鼠标各种事件介绍

一、事件对象的捕获事件对象：event object当文档中触发了一个事件，那么会产生一个针对该事件的事件对象。该事件对象由js引擎底层产生。事件对象是一个非常重要的对象。事件对象中包含了事件的所有的信息。比如：鼠标点击的事件对象中，就包含了鼠标点击的坐标。按键事件对象中就保存了按键的名称，按键的键值，可以获得用户按下的是哪个按键。事件对象的捕获：对于谷歌火狐等浏览器，该事件对象是通过事件处理函数的实参传入的。直接给事件处理函数添加一个形参即可以捕获事件对象。IE低版本（IE8及其以前

2020-08-30 19:04:43 194

原创 021Day--构造函数，函数的原型对象，this的总结，原型练习，js的继承，原型链继承，组合继承，类型的静态方法

一、构造函数的执行过程构造函数的执行过程：通过代码调试：debug过程。断点调试：breakpointbug：代表了程序中的错误。原意是臭虫的意思。调试按钮：step：逐步执行代码，执行下一行代码。遇到方法调用，会进入方法内执行。step out：跳出当前方法，执行方法后的代码。step into：进入下一个方法执行。step over：逐步执行代码，执行下一行代码。遇到方法调用，不会进入执行。构造方法的执行过程：1：实参给形参赋值，js底层创建好空对象，并赋值给this。2：通过t

2020-08-28 14:12:57 167

原创 025Day--jQuery添加事件方法、动画函数-显示、隐藏、滑动、淡入淡出、stop、each

一、jQuery添加事件的方式-1重点：jQuery事件处理方式-1语法：jQuery对象.事件函数名([数据对象],callback);[数据对象]：可选择参数，是一个对象数据。可以在事件处理函数中访问该数据。补充：jQuery添加事件不会产生覆盖。<div>hello</div><script> var $div = $("div"); //没有数据实参的写法。 $div.click(function (e) {

2020-08-27 22:07:17 293

原创 024Day-jQuery方法-删除、克隆、祖先元素、后代元素、兄弟元素、结构过滤等方法

一、常用方法-scrollLeft()-scrollTop()<style> div{ width: 100px; height: 100px; border: solid 1px; overflow: scroll; } body{ height: 3000px; } </style>

2020-08-27 21:13:42 477

原创 022day-instanceo操作符，in关键字，作用域链，闭包，三种设计模式

一、instanceof 操作符instanceof：js的关键字。作用：用来判断一个对象是否是某种类型的实例。用来判断对象的原型链中是否包含了类型的原型对象。类型的原型对象是否在对象的原型链中。如果在原型链中返回true，否则返回false。结论：子类型对象永远是父类型的实例。<script> //父类型的构造函数。可以作为多个子类型的父类型 //比如工人，农民，学生都是人的子类型。 //Person类型是所有的子类型中的公共的部分提取出来形成的。

2020-08-26 21:43:31 218

原创 023Day jQuery介绍-$的使用-选择器介绍-常用方法

一、jQuery介绍jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。学习 jQuery就是学习 jQuery中常用的方法的使用。如果想使用jQuery，需要引入

2020-08-25 20:56:21 255

空空如也

空空如也