苗雪松的博客

原创 判断所有数据类型是否相等

判断值相等

原创 递归简化数据处理方式

递归简化数据 过滤数据

原创 PDF文件预览

下载 pdf.js pdf.worker.js<template> <div id="canvas_pdf" class="scrollBar" ></div></template><script>export default { name: "viewPdf", data() { return {}; }, mounted() { this.createCanvasPDF("h

原创 echarts封装

<template> <div :class="className" :style="{height:height,width:width}" /></template><script>import * as echarts from "echarts"// import resize from "./mixins/resize"export default {// mixins: [resize], props: {

原创 修改el-table底部滚动条 添加右边滚动条

<template> <div class="dhc-table"> <el-row> <el-col :span="16"> <div class="table"> <el-scrollbar style="height: 100%"> <el-table :data="tableData" style="width: 100%">

原创 后端取到的数据前端分两组 定时器循环赋值 实现循环切换效果

if (response.data.code == 0) { var data = response.data.data; let result = []; var arr = []; var arrIndex = 0; console.log(data.list,"ist") console.log(data.list.length,"length"...

原创 api封装

util.js文件import axios from 'axios'// import store from '@/store'// import { Toast } from 'vant'const service = axios.create({ baseURL: 'http://localhost:8080', // url = base api url + request url withCredentials: true, // send cookies when cros

原创 背景图设置的代码

display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: bord...

原创 vue自行开发遇到的问题及解决办法

1.安装sass遇到的问题使用<style lang="sass" scoped>报错 ：Syntax Error: SassError: Invalid CSS after “.ErrorPage {”: expected “}”, was "{"on line 58 of D:\newPro\studyfront\frontmxs\src\views\error\404.vue使用时要注意不能用sass:改为<style lang="scss" scoped>2

原创 盒子左滑右滑动

.addWarehouse {width: 36%;height: calc(100% + 23px);left: -40%;top: 0;background: url(’…/…/assets/emcr/common/bg.png’) no-repeat center;background-size: cover;transition: left 1s;-moz-transition: left 1s;/* Firefox 4 /-webkit-transition: left 1s;

原创 WebSocket链接代码

<template> <div :class="{ 'dhcvue--collapse': isCollapse }" class="dhcvue-contail"> <div class="dhcvue-header"> <!-- 顶部导航栏 --> <top /> </div> <div class="dhcvue-layout"> <div cla

原创 vuex存储localStore数据

//存储store数据import { validatenull } from '@/util/validate'import website from '@/const/website'const keyName = website.key + '-'/** * 存储localStorage */export const setStore = (params = {}) => { let { name, content, type } = params

原创 当前时间统一转换

时间的统一处理export function formatDate(date) { const dateTime = new Date(date); const YY = dateTime.getFullYear(); const MM = dateTime.getMonth() + 1 < 10 ? '0' + (dateTime.getMonth() + 1) : dateTime.getMonth() + 1; const D = dateTim

原创 判断数据类型的方法

当用typeof的时候，数组也是Object，和我们初衷不一样，这个方法完美解决 只需要传入自己的数据export const getObjType = obj => { var toString = Object.prototype.toString var map = { '[object Boolean]': 'boolean', '[object Number]': 'number', '[object String]': 'string', '[ob

原创 查询数组字段的下标

let index = this.formData.collapseForm.findIndex((el) => el.formType == “iframe”);

原创 关于webpack-require-http按需加载的使用

看到网上CSDN里的那些复制来复制去的代码，是真的烦，不知道稍微看看官方文档吗 ？ 一眼看过去都是设置定时器 为啥要设置1500ms的定时器，如果网络不好1.5s还没加载出来呢？那不是map对象还是找不到吗？坑了我一万年。在此我写下我的代码吧。按照常规 需要引入webpack-require-http1.先下载webpack-require-http, 下载方法就不说了，在build/we...

原创 根据数组的某一字段重新分组

var map = {}, dest = []; let custody_list = [ { media_create_time: 123, media_type: 5, car: 456 }, { media_create_time: 456, media_type: 6, car:...

原创 根据json的某一字段的值相同重组数组

this.list = resp.result; var map = {}, dest = []; for (var i = 0; i < this.list.media.length; i++) { if (!map[this.list.media[i].media_create_time]) { if (this.list....

原创 Redux persist配置

import { createStore, applyMiddleware, compose } from 'redux';import thunk from 'redux-thunk';import reducers from './reducer'// import {persistStore,persistReducer} from 'redux-persist';// im...

原创 react配置css module,与antd等组件库冲突最新版react webpack 2019.08.05

配置时：先执行npm run eject, 这个是把隐藏的配置显示出来。webpack.config.js在配置CSS module时，我在规则里都加了modules:true, 导致CSSmodule和antd冲突，antd样式失效,其实只需要加一行就行，已经重点标出。{test: /.(js|mjs)$/,exclude: /@babel(?:/|\{1,2})runtime/,l...

原创 ajax封装及其数据加密

***main.jsimport ApiPlugin from “./plugin/api.js”Vue.use(ApiPlugin)***api.jsimport api from “…/api/index”使用方式 this.api.api.api.{module}.KaTeX parse error: Expected '}', got 'EOF' at end of input:...

原创 路由

import Router from ‘vue-router’import Vue from “vue”import importLoading from ‘…/utils/importLoading’Vue.use(Router);const profile_settings_pages = [{path: ‘/profile_binding_phone’,name: ‘Profi...

原创 微信支付的demo

&lt;template&gt; &lt;div class="scroll"&gt; &lt;div class="price-container"&gt; &lt;p&gt;支付金额&lt;/p&gt; &lt;p&gt;{{repairOrder.pay_amount|toYuan}}&lt;/p&gt; &

原创 react-redux的使用

https://www.cnblogs.com/bax-life/p/8440326.html

原创 IOS点击输入框获取焦点，弹起键盘，页面被顶起，失去焦点后，键盘滑下，页面无法恢复的解决办法

kickBack () {setTimeout(() => {window.scrollTo(0, document.body.scrollTop + 1)document.body.scrollTop >= 1 && window.scrollTo(0, document.body.scrollTop - 1)}, 10)}

原创 登陆校验

router.beforeEach((to, from, next) => {document.title = to.meta.title; //设置标题util.wx_init(); //给每个页面初始化路由配置//如果这个页面需要登录if (to.meta.login) {//从user store里面取出来登录标记let is_login = store.state.use...

原创 react阻止事件冒泡 并传递参数 index

原创 视频或者图片上传（vue版本）可直接使用

<div> <span>视频上传</span> <a href="javascript:;"> <button>上传</button> <input type="file" name="file" @change="uploadUp($event)" enctype="m...

原创 点击页面实现向上滑动文字并消失jQuery实现

<html> <head> <meta charset="UTF-8"/> </head> <body> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"&...

原创 适配iponeX

用过iPhone X的朋友都知道，IPnoneX底部有一个黑线，如果项目有底部导航栏的话，会被挡住，非常影响体验。顺序不可以颠倒，需要定位元素添加 <meta name="viewport" content="viewport-fit=cover" />{ padding-bottom: constant(safe-area-inset-bottom); paddi...

原创 六位验证码实现

<template> <div class="code-input-main"> <div class="code-input-main-item">{{code[0]}}</div> <div class="code-input-main-item">{{code[1]}}</div&gt...

原创 vux模态框

<x-dialog v-model="showDelQueue" :dialog-style="{'width': '240px', 'height': '151px', 'border-radius': '10px'}" > <div class="dialog-confirm"> <...

原创 vue上拉加载组件及其使用方法

该代码为vue上拉加载组件 可以应用于各种手机vue项目 把该代码放到一个独立的组件里 我们起名为loadmore.vue*## **loadmore.vue文件***<template> <div class="my-loadmore"> <div class="loadmore-content" :class="{'is-dropped'...

原创 vconsole手机调试以及规则配置

'use strict'const path = require('path')const utils = require('./utils')const config = require('../config')const vueLoaderConfig = require('./vue-loader.conf')const vuxLoader = require('vux-loade...

原创 webpack打包之后不再显示console.log信息

在webpack.prod.conf.js 文件中（35行左右）将设置修改为new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false, drop_debugger: true, drop_console: true }, sour...

原创 vue封装的一个暂无数据组件

&lt;template&gt; &lt;div class="zwsj"&gt; &lt;img :src="icon" :width="imgW" :height="imgH"/&gt; &lt;div style="color: #999;font-size: 12px;margin-top: 5px"&gt;{{tex