- 博客(26)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 react表单中参数联动和动态校验
用hidden属性来实现，相当于vue中的v-show，此方法不会过滤掉参数；用三元运算符则会直接过滤掉参数和校验规则。
2024-04-10 15:29:45
185
原创 Ant+React树形穿梭框实现(支持搜索和全选)
参考地址：https://blog.csdn.net/weixin_49581008/article/details/128953065。
2023-12-26 10:55:01
877
原创 react+ts+hooks中组件之间的使用
/ 父组件回调函数类型定义//子组件提交的方法getData()<Button编辑</Button></div>useEffect,useState,try {//将子组件的事件传递给父组件//父组件要调用的子组件的方法//将父组件要调用的方法，暴露出去showModal}))return (<Modaltitle='创建视图'centered<div子组件内容</div></Modal>
2023-12-25 10:58:03
435
原创 vue组件封装npm包
npm官网: https://www.npmjs.com/首先去官网注册一个账号，把设置的账号密码记住，然后再把注册的邮箱验证好，否则不行。上述完事之后我们打开终端(cmd)输入 nrm -V 验证一下是否有nrm，没有的话就用 npm i nrm -g 这个命令把nrm下载下来，之后在输入 nrm -V 验证下就完成。
2023-03-24 10:57:42
290
原创 代码编辑器vue2-ace-editor的使用
1.Install: npm install --save-dev vue2-ace-editor2.详细代码<template> <div class="container"> <editor ref="aceEditor" v-model="content" @init="editorInit" width="700" height="600" lang="javascript"
2022-04-15 09:11:54
1897
原创 Echarts中echarts-auto-tooltip的使用
######1.Echarts的大屏效果，使用鼠标移入不是很方便，所以就有了自动滚动的tooltip的效果，使用方法很简单，直接创建echarts-auto-tooltip.js引入；echarts-auto-tooltip.js内容如下(function (global) { global.tools = global.tools || {}; /** * echarts tooltip 自动轮播 * @author liuyishi * @par
2022-04-13 16:30:10
1438
1
原创 vue项目后端返回数据导出excel表格
1.安装npm i xlsxnpm install xlsx-style --save安装npm install xlsx-style --save的时候会报错，处理下就好需要修改源码：1、在\node_modules\xlsx-style\dist\cpexcel.js 807行把 var cpt = require(‘./cpt’ + ‘able’); 改成 var cpt = cptable;2、在\node_modules\xlsx-style\ods.js 10行和12行把路径改为
2022-04-06 08:54:21
1152
原创 elementUI的tree组件搜索过滤，可识别拼音，且不区分大小写
1.首先需要安装 js 拼音库 CnChar ，这个库主要就是做汉字转拼音和汉字笔画数的。使用 npm i cnchar安装任何在main.js中引用import cnchar from ‘cnchar’;Vue.use(cnchar);2.完整代码如下：<el-input placeholder="输入关键字进行过滤" v-model="filterText"></el-input><el-tree cl
2021-12-22 10:03:06
974
1
原创 vue+elementUI实现表格拖拽
1.使用sortablejs的拖放排序列表的js插件；（http://www.sortablejs.com/index.html）来实现UI框架是elementUI；在elementUI（ref=“dragTable” row-key=“id”）是必须的 <el-table ref="dragTable" row-key="id" />2.script代码，加载完数据之后，执行Sortable的方法<script>import Sortable from 'sorta
2021-12-22 09:44:16
336
原创 vue项目中的验证码
#####一、效果一：#####代码：// 第一种方法，span，不绘制干扰点<template> <div class="ValidCode disabled-select" :style="`width:${width}; height:${height}`" @click="refreshCode"> <span v-for="(item, index) in codeList" :key="index" :style="getStyle(item)"
2021-12-22 09:38:08
339
原创 vue项目动态加载json文件，数据不更新
原本使用json文件是为了加载，不用重新打包，结果测试数据改变之后，没有加载更新；解决办法：1.将json文件改为js文件内容 window.dict =(之前的 info.json 内容)2.在main.js中引入Vue.prototype.$dict = window.dict3.在index.html中引入(注意：引入的时候要在body标签之上，不然会报错)<script src="./info.js"></script>4.页面中使用 {{$dict.d
2021-12-22 09:35:35
1961
原创 vue+elementUI的国际化
安装组件和插件cnpm i element-ui -S // 安装elementcnpm i vue-i18n -S //安装i18n2.在src中创建语言包3.在main.js中引用import Vue from "vue";import App from "./App.vue";import router from "./router";import store from './store'//中英文切换import VueI18n from 'vue-i18n'Vue.
2021-12-22 09:33:27
462
原创 vue跨页面调用方法
首页要创建一个js的文件；我将其命名为bug.jsimport Vue from 'vue'export default new Vue()要操作使用的页面中，直接是引入bus文件：import bus from “@/utils/bus.js”使用方法： bus.$emit( 'updateKeyWords' , this.keywords);接受的页面可以直接在mounted中接受mounted(){ let _this=this; bus.$on('up.
2021-09-16 11:17:01
769
原创 IE浏览器下，后台接口数据更新不及时问题
在用ie做web项目，发现有部分接口请求的数据，哪怕修改了状态以后，重新查询的结果还是旧状态数据，但是在谷歌浏览器却不会出现这个问题，经过分析可能是缓存问题。经过多方搜索发现：IE 浏览器在发起 GET 请求，当参数一样时，浏览器会直接使用缓存数据解决方案以下三种都可以：1、最简单的方法在我们的 get 请求后面添加一个参数 t = 时间戳2、让后台改成post请求3、请求标头里放两个 k-v ['Cache-Control'] = 'no-cache'; ['Pragma'] = 'n
2021-03-18 11:32:43
388
原创 elementUI的时间选择，绑定format的返回值问题
时间选择器分为日期选择器和日期时间选择器两种1.只绑定format="yyyy-MM-dd HH:mm"返回的是这种格式Thu Feb 25 2021 10:10:13 GMT+0800 (中国标准时间)若 绑定value-format=“yyyy-MM-dd HH:mm”，返回的格式便是你绑定的格式<el-date-picker v-model="search_time" format="yyyy-MM-dd HH:mm"
2021-02-23 16:52:57
973
1
原创 vue中各种文档的下载
###1.下载本地的文件####1.在vue-cli 3.x+中，直接将文件放在public下面window.location.href="/file/xxx.doc"这种写法本地不会有问题，但是线上部署出现了问题，显示文件找不到；所以改为window.location.href=`${process.env.BASE_URL}file/beian_import.xls`当前也可以不用window.location.href来下载，可以使用dom动态生成a标签来下载；downExcel(){
2021-01-28 08:49:21
619
原创 数组方法总结
数组原型方法主要有以下这些**join()：**用指定的分隔符将数组每一项拼接为字符串**push() ：**向数组的末尾添加新元素**pop()：**删除数组的最后一项**shift()：**删除数组的第一项**unshift()：**向数组首位添加新元素**slice()：**按照条件查找出其中的部分元素**splice()：**对数组进行增删改**fill()????*方法能使用特定值填充数组中的一个或多个元素filter():“过滤”功能**concat()：**用于连接两个或多
2021-01-12 09:22:32
97
原创 数组去除数组中为“假”的元素
array.filter(Boolean)Array.prototype.filter()方法用于过滤数组，返回一个符合特定操作的元素组成的数组。array.filter((item) => {return Boolean(item)})也就是说这样写的意思就是去除数组中为“假”的元素。0、undefined、null、NaN、′′′、false\color{#FF0000}{0、undefined、null、NaN、'''、false}0、undefined、null、NaN、′′′、fal
2020-12-26 10:28:18
207
原创 vue-cli打包优化之分析工具webpack-bundle-analyzer
// 1. 安装cnpm install webpack-bundle-analyzer --save-dev// 2. 在/build/webpack.prod.conf.js文件中引入const BundleAnalyzerPlugin = require(‘webpack-bundle-analyzer’).BundleAnalyzerPlugin// 然后配置一下：plugins: [new BundleAnalyzerPlugin()]// 3. 在package.json文件中配
2020-12-26 10:23:33
199
原创 vue使用cdn加速优化项目
webpack会将所有的依赖包都生成并打包到js/chunk-vendors.97b0334e.js中，这样会导致这个包的体积过大，在加载的时候会有延时。解决办法：通过externals加载外部CDN资源：1、复制一份main.js改名为main-prod.js。注意：这个优化是项目结束时干的事，不要一开始就进行优化。2、vue.config.js：（当为发布模式时，使用main-prod.js文件，并且设置externals）chainWebpack: config => { //
2020-12-26 10:22:43
447
原创 apicloud入门第一步
一、首先第一步就是进入官网（https://docs.apicloud.com/），找到开发者文档，api对象。API对象呢，主要是分为这四大类，前三类就好比手机的设置对于手机而言，最后一个method是最为重要的，今天我们就先来说说APP的几个主界面是如何实现的。二、一开始由于我们公司用的前端框架是mui，所以就一直在看mui的窗口管理，后来发现根本用不着，使用apicloud开发打开底部栏只需要一个方法就搞定。api.openFrameGroup({ name: 'group1',
2020-12-19 20:30:56
274
1
原创 vue中elementUI的表格实现自定义编辑
此处我使用了mixnis混合tableEdit.js// 实现table表格，点击编辑export const tableEdit = { directives: { focus: { // 指令的定义 inserted: function(el) { el.getElementsByTagName('input')[0].focus() // el.focus() } } }, data() {
2020-12-19 13:31:46
869
1
原创 vue中elementUI的Dialog 对话框可自定义拖拽
首先在src下面创建"src\directive"文件夹然后在下面创建el-drag-dialog文件下，在里面创建index.jsindex.jsimport drag from './drag'const install = function(Vue) { Vue.directive('el-drag-dialog', drag)}if (window.Vue) { window['el-drag-dialog'] = drag Vue.use(install); // es
2020-12-19 13:22:01
289
1
原创 vue中elementUI的tree组件的使用（加线条加自定义图标）
vue中elementUI的tree组件的使用（加线条加自定义图标）后台管理系统是从layui过来的，所以总是觉得elementUI的tree组件线条没了不好看，####第一中效果有线条html要在tree组件的直系父集上面加class名字tree-container，在自己加tree的class <div class="tree-container"> <el-tree ref="tree" class="tree fi
2020-12-19 13:18:09
2857
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人