几度风雨见丹心-CSDN博客

项目中通常会把一些选项或其他固定内容统一管理到数据库中，称作字典数据，前后端交互存储的是字典的值（如：1、2、3、Y、N等），而前端显示的是字典的翻译（如：男、女、是、否等），这就需要在一些展示性的位置由前端根据获取的值翻译成汉字方便用户阅读。另有一好处是如果值发生了变动，不需要修改前端代码，如1对应的翻译男要更改成女，可以直接变动数据库中的数据。...

2022-06-28 17:45:22 604

原创 uniapp-uview的表单校验——同步，异步，图片必输，数字校验爬坑

uniapp-uview的表单校验——同步，异步，图片必输，数字校验爬坑

2022-06-28 15:52:56 5241 1

原创 uniapp自增表单项

业务需求：某一表单项分为两个或多个输入框，两个或多个为一组，可以以组为单位，根据客户意愿自增或删除。期望效果图：1、页面初始时【主要检测设备】只有一行，需填入两项，设备名称和台数。2、点击新增按钮后，自动新增一组，此后每点击一次新增皆在最后新增一组。3、点击某组最右侧【删除】，即可删除掉这一组表单项。技术：uniapp，uview（UI框架），JS......

2022-06-28 15:08:24 3633 1

原创 vue传值的12种方式

组件传值1、父传子（1）在父组件的子组件标签上绑定一个属性，挂载要传输的变量（2）在子组件中通过props来接受数据，props可以是数组也可以是对象，接受的数据可以直接使用 props: [“属性名”] 或 props:{属性名:数据类型}//父组件<template> <div> <i>父组件</i>  <son :faToSonName='name'></son&

2022-04-02 14:44:00 14617 1

uni-app 介绍uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架。适用平台：Android、iOS、微信小程序。实现了一套代码，同时发布到Android、iOS、微信小程序。官方：https://uniapp.dcloud.io/开发开发工具（1）HBuilderX下载地址：http://www.dcloud.io/hbuilderx.html（2）微信开发者工具下载地址：https://developers.weixin.qq.com/miniprogram/dev

2021-04-20 09:35:11 4932

原创 uniapp封装request，设置请求头与token，前端判断token过期

common文件夹下新建request.js文件// BASE_URL只是请求url的前半部分import BASE_URL from './url.js'// token默认过期时间var expiredTime = +new Date() +1800*1000// 不需要登录的接口const noToken = [ '/auth/login'];const request = function(options={}) { // 判断是否需要登录 if (!(noToken.i

2021-04-18 21:08:07 9642 2

原创 uniapp中，使用scroll-view 自写可滑动顶部导航栏，且点击后局部刷新

业务需求如下图：顶部是一个可滑动导航栏，点击导航栏之后，下面的部分局部刷新。1、定义top-nav组件<template> <view class=""> <view class="scroll-box"> <scroll-view class="scroll-view_H" scroll-x="true"> <view class="scroll-view-item_H" :class="currentItem.name==t

2021-04-18 20:59:45 773

原创 gitlab命令行及操作

一、拉取项目本地创建一个文件夹，用来存储克隆下来的项目win+r -> cmd,进入上面创建的文件夹，键入命令行，git clone + Git库的地址。二、拉取分支上的项目到本地与远程仓库建立连接：git remote add origin XXXXX.git使用git branch 查看本地是否具有dev分支如果没有 git fetch origin devgit checkout -b dev origin/dev在本地创建分支dev并切换到该分支git pull or

2021-03-24 14:09:00 2462

原创让任意元素全屏

1、JavaScript Fullscreen API：全屏操作全屏API可以控制浏览器的全屏显示，让一个Element节点（以及子节点）占满用户的整个屏幕。目前各大浏览器的最新版本都支持这个API（包括IE11），但是使用的时候需要加上浏览器前缀。Element节点的requestFullscreen方法，可以使得这个节点全屏。var elemet = document.getElementById("videoElement");launchFullscreen(elemet);func

2021-03-23 16:23:13 2118

原创 DvaJS和antd pro

1、dva官网封装了redux、redux-saga、fetch（http数据交互，request）。对数据流的操作更简单。dva项目 1、安装dva-cli cnpm install -g dva-cli 2、查看版本 dva -v 3、创建项目 dva new dvaapp 4、进入项目 cd dvaapp 5、启动项目 npm start 项目目录结构 src components 可复用的UI组件文件夹 models 数据仓库，redux

2021-01-10 16:36:32 258

原创 react-redux、redux-thunk、redux-saga异步获取数据

redux-thunk redux中间件redux中间件，处理异步请求actionCreators可以返回一个函数，在该函数里有参数dispatch，发送异步，异步成功之后分发action更改数据。安装：yarn add redux-thunk配置：1.从redux中引入applyMiddlewareimport {applyMiddleware} from ‘redux’;2.引入redux-thunkimport thunk from ‘redux-thunk’;3.使用中间件，

2021-01-08 18:07:03 308

原创 redux

1、安装reduxyarn add redux2、创建reducer

2021-01-03 22:18:22 201

原创 react05--企业级开发

1、ant design官网地址2、统一配置后台请求路径和方法根目录下新建myAjax.jsimport $ from 'jquery';import {baseURL} from './config';exprot default function(){ return new Promise (url,method,data){ $.ajax({ url:baseURL + url; method, data, success(res){ resove(r

2021-01-01 20:53:23 188 1

原创 react04---

1、refs 参照this.refs —> 对象，存放的是组建中使用ref属性，并且属性值为字符串的，将node节点保存到refs中。DOM对象event.target 可以获取挂载在组件上//子组件import React from 'react;class MyRefs extends React.Component{ constructor(props){ super(props); this.state = {}; } //willMount willUpda

2020-12-28 23:14:11 122

原创 react03--

2020-12-27 22:27:03 105

原创 react02--

1、使用react方法一在单页HTML文件中，<head>标签内引入cdn<script src="https://unpkg.com/react@16/umd/react.development.js"></script><script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>&

2020-12-26 17:17:06 103

原创 react 01--简单了解react

1、单向数据流：view -> actions->state->viewstate:驱动应用的数据源，状态view:以声明的方式将state映射到视图actions:响应在view上的用户输入导致的状态变化单项数据流过程：简单的单向数据流是只用户访问View，view发出用户交互的action，在action里对state进行响应更新。state更新后会触发view更新页面的过程这样数据总是清晰的单向进行流动，便于维护并且可以预测。2、react脚手架和vue脚手架的区别c

2020-12-24 17:11:29 108 1

原创 Git使用

1、git init 初始化2、git remote add origin 仓库路径将文件夹与仓库绑定3、git pull origin master拉取4、git add *将全部内容追加到提交列表中5、git commit -m ‘注释’将提交列表的内容追加到本地仓库6、git push origin master提交到远程仓库有冲突时需要解决冲突git pull origin master --allow-unrelated-historiesvscode编辑器中，图形化操作

2020-12-24 16:03:58 65

原创 react安装

1、使用react需要提前安装node.js和npmcmd打开命令提示符：检测版本输入：node -v安装node时会自带一个npm的包管理工具。检测npm版本输入：npm -v如若以上两个命令输入都返回版本号，则安装成功！2.设置NPM国外npm较慢，容易安装失败，可以设置成淘宝的镜像来代替原有的。cmd命令提示符中键入：npm config set registry https://registry.npm.taobao.org3.安装create-react-app通过安装

2020-12-23 16:20:12 1797

原创网络相关知识总结

1、简单的网络构成2、

2020-12-10 22:16:55 453

原创 uniapp开发手机app，一个页面调用多次同一个下拉框子组件，保证同时间下拉框只打开一个（兄弟组件间的通讯））

1、业务需求：封装一个下拉框的组件，下拉框弹出时，下拉框下面有半透明遮罩，下拉框上面正常显示，效果如图：2、问题：当一个页面同时引用多次该组件时，下拉框和遮罩会同时存在彼此叠加3、解决：其实这个过程就是一个兄弟组件之间的通信问题，当有下拉框打开时，通知另外的下拉框都保持关闭状态。父页面引用组件代码：<template>  <view class="searchBox"> <view class="inline shopNum

2020-11-19 19:32:29 2434

原创 JS模板字符串拼接

$oss是main.js中定义好的，主要用于图片URL的拼接Vue.prototype.$oss = { basicAddress: 'http://oss.bailimeijia.com'}1、在HTML中使用模板字符串拼接<img class="img-circle" :src="$oss.basicAddress + '/' + businessorgData.idCardUrl1" style="width: 100px; height: 100px" />2、在js中

2020-11-16 19:20:08 2835

原创 JS子组件编写HTML代码片段传递给父组件，再展示在页面上

子组件：<template> <div class="upload-container"> <el-button :style="{background:color,borderColor:color}" size="mini" type="primary" @click="pushBusinessInformation"> 商家信息 </el-button> </div></template>

2020-10-27 19:47:18 386

原创两个对象数组之间比较是否有相同字段、数组与对象数组比较

现有如下两个数组，分别是从后台不同接口中取到的，需要将两个对象数组比较，将第二个数组中promotionType值等于第一个数组中Key的对应的promotionCount值写入到第一个数组中，键名为counttempSales = [{ key:'1', value:'拼团'},{ key:'2', value:'秒杀'},{ key:'3', value:'满减'},{ key:'4', value:'满送'}]，ruleRecordCount = [{ promotion

2020-10-27 18:50:10 8370 1

原创 JS遍历树状数据，选择需要的字段重构一个新的树状数据

1、原树状结构数据treeData = [ { "id": 1, "parentId": 0, "type": "结生上取段日名求将查由六才酸商验又每。", "referenceId": 234, "sort": 29, "code": "你计世派列太是后气住内带却所就。", "name": "直按种白亲叫也总较机低及省。", "userCount": 196,

2020-10-10 14:19:01 2711 1

转载如何在父组件中去覆盖子组件中样式?

如果一定要父组件中去覆盖子组件（第三方的）的样式：方法一：不要写成scoped. 此时，样式就是全局的。方法二：在保持scoped的情况下，还可以使用 /deep/。为什么用了scoped之后，不能覆盖子组件的样式？因为scoped会在选择器最后加data-v-xxxxxxx这属性名，所以无法选中子组件的样式。为什么用了/deep/之后，就可以覆盖子组件的样式？.index{ padding-top:50px; /deep/ .van-tabs__wrap {

2020-09-23 09:02:59 1431

原创 uniapp制作微信小程序动画效果

业务需求：点击右侧橙色背景 ‘身份切换’圆形后，显示弹框，同时橙色圆形1s钟侧滑显示选择身份后弹窗消失，同时橙色圆形回到原位<view class="changeIdentities" :class="{ active : active }" @tap="showChangeIdentitiesBox"> <view class="">身份</view> <view class="">切换</

2020-09-19 10:19:41 2843

原创 uniapp开发微信小程序，引入第三方SDK高德地图

一、获取高德Key：官方获取key的方法在这二、创建项目之后下载并安装微信小程序SKD：如果是开发安卓、IOS、APP项目，请找到对应的包下载并解压。下载微信小程序SDK解压后得到 amap-wx.js 文件，在创建的项目中，新建一个名为 libs 目录，将 amap-wx.js 文件拷贝到 libs 的本地目录下，完成安装。这一步在uniapp运行的时候会报错，因为解压后的js文件方法都是wx.XXX。手动把这些前缀都改成uni.XXX之后可以运行了。以下是修改之后的文件：function

2020-09-08 09:36:27 8755 9

原创计算两个时间戳之间的天数，小时，分钟。

项目需求：后台数据库传递回一个活动截止时间的字符串（13位），根据这个截止时间字符串计算出当前时间与截止时间之间的天数，小时。效果如图：JS代码如下：// 商品详情getGoodsDetail() { let that = this; that.$api(this.baseURL, { id:this.cleckedId }).then(res => { if (res.code === 200) { that.goodsInfo = res.data; // 如果

2020-09-04 10:09:11 4509

空空如也

空空如也