那是遇知吧-CSDN博客

原创 iview的select数字模糊查询功能实现

然后判断是否是数字类型!isNaN(parseFloat(querys)) && isFinite(querys)，还要就是要清除下空格。思路是这样， projectList是全部项目数据，projectListSearch是模糊查询的下拉数据。如果值为‘’，就清空v-model的值，并让模糊下拉数据等于全部数据即可。主要是on-query-change这个方法是监听搜索词的val值。

2023-06-16 11:23:24 744

原创 iview的select加filterable多点击几次数据会减少

这个问题的产生应该是因为有空格，filterable选中值后，再点击change事件获取的值就是前面加了空格，可以写在label里面。

2023-06-16 11:17:04 346

转载 iview和elementUI编写的季度组件合集

【代码】iview和elementUI编写的季度组件合集。

2023-06-12 17:05:29 555

原创 Echarts的series数据整合成插件需要的数据

Echarts的series数据整合成插件需要的数据

2022-08-01 10:10:07 491

安装dayjs依赖包 importdayjsfrom'dayjs' export const formatDate = (value, format = 'YYYY-MM-DD') => { if (value) { let date = new Date(value) return dayjs(date).format(format) } else { return null } } export const f...

2021-11-19 11:47:46 885

原创 ES6复习小记

1：函数参数的解构赋值 [1, undefined, 3].map((x = 'yes') => x); // [ 1, 'yes', 3 ] [[1, 2], [3, 4]].map(([a, b]) => a + b); // [ 3, 7 ] 2：从函数返回多个值 // 返回一个数组 function example() { return [1, 2, 3]; } let [a, b, c] = example(); // 返回一个对象 function example(

2021-10-29 16:48:30 223

原创 vue中点击加减按钮，添加或删除一列输入框

<template> <el-form :model="form"> <div v-for="(item,index) in form.addForm" :key="`addForm${index}`"> <el-col :span="7"> <el-form-item label="" :prop="`addForm.${index}.name`"> .

2021-10-27 14:24:44 1922

原创 VUE之elementUI组件：输入金额的限制（两位小数、不能0或.开头只能输入数字和.）

参考了几种金额判断是方法整合了下方法： <el-form :model="form" :rules="rules"> <el-form-item label="金额" required prop="money"> <el-input placeholder="请输入金额" v-model="form.money" /> </el-form-item> </el-form> date(){ const

2021-10-22 14:28:13 4658

原创 Css3弹性盒子实现自适应功能方法

1：只显示最多10条数据，高度自适应 <template> <div id="app"> <div class="content"> <p>111111111111111111111111</p> <p>111111111111111111111111</p> <p>111111111111111111111111<

2021-09-06 17:26:51 1194

转载基于vue-grid-layout的自定义布局桌面

重要：vue-grid-layout拖拽自定义桌面demo演示项目跑起来会遇到一个错误，把文件名改一下就可以跑起来了,如下图所示：

2021-08-26 16:25:27 2832 2

原创 bizcharts入坑问题Part2：X轴与Y轴添加单位

import React from "react"; import { Chart } from "bizcharts@3.5.8"; class Basic extends React.Component { render() { const cols = { value: { min: 0, range:[0,0.93], alias:'次' }, year: { range: [0,.

2021-05-11 10:30:27 1078

原创 bizcharts入坑问题Part1：雷达图文字过长怎么换行

官网：bizcharts 完整代码如下： import React from "react"; import { G2, Chart, Geom, Axis, Tooltip, Coord, Label, Legend, View, Guide, Shape, Facet, Util } from "bizcharts@3.5.8"; import DataSet from "@antv/data-set"; class Basic extend.

2021-05-10 15:22:58 967

原创 React之useRef的简单用法-获取input里面的值

useRef import {useRef} from 'react' const inputVal = useRef(null) const inputValOpt=()=>{ console.log(inputVal.current.state.value) console.log(inputVal.current.input.defaultValue) } <input type='text' ref={inputVal }/> <button onC.

2021-04-19 17:27:09 6151 5

原创每日一练29：antd-design框架搭建表格功能-增删功能

首先说下功能是表格数据展示，点击增加会出来一个表单弹框，删除用户直接调接口删除就行 1：首先写个新增用户按钮 import {PlusOutlined} from '@ant-design/icon' <Button icon={<PlusOutlined/>} type="primary" onClick={()=>{showModal()}>新增用户<Button> 2：写个表单modal import React,{useState} from

2021-04-19 15:56:09 830

转载 JavaScript 复杂判断的更优雅写法

前提我们编写js代码时经常遇到复杂逻辑判断的情况，通常大家可以用if/else或者switch来实现多个条件判断，但这样会有个问题，随着逻辑复杂度的增加，代码中的if/else/switch会变得越来越臃肿，越来越看不懂，那么如何更优雅的写判断逻辑，本文带你试一下。举个例子，先看一段代码 /** * 按钮点击事件 * @param {number} status 活动状态：1 开团进行中 2 开团失败 3 商品售罄 4 开团成功 5 系统取消 */ const onButtonCl.

2021-02-07 11:43:39 178

转载 ES7 and ES8 新功能

可选链运算符使用可选链运算符，只需要使用?.来访问嵌套对象。而且如果碰到的是undefined或null属性，那么它只会返回undefined。 const opt = { obj1: { obj2: { obj3: { obj4: { obj5: 5 } } } } } console.log(opt?.obj1?.obj2?.obj3?.obj4?.obj5); 当我们的程序执行...

2021-02-05 17:02:17 228

转载 Css的用法总结part4 line-clamp

line-clamp 参考：line-clamp 限制在一个块元素显示的文本的行数。 -webkit-line-clamp 是一个不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。为了实现该效果，它需要组合其他外来的WebKit属性。常见结合属性： display: -webkit-box; 必须结合的属性，将对象作为弹性伸缩盒子模型显示。 -webkit-box-orient 必须结合的属性，设置或检索伸缩盒对象的子元素的排列

2021-02-04 16:33:24 1550

原创 Vue常用问题总结-2class与style

一Class与Style绑定列子1： <div class="static" :class="{ active: isActive, 'text-danger': hasError }" ></div> data: { isActive: true, hasError: false } 渲染结果为： <div class="static active"></div> 列子2： <div v-bind:cl...

2021-02-01 15:47:27 313

原创 Vue常用问题总结-1

图片引入方式对象图片第一种方式： <div :style="`background-image:url('${BANNER')`"></div> import {BANNER} from '@/const/imgUrl' export default { data() { return {BANNER｝ } 第二种方式： background-image: url('~assets/loading.gif'); ...

2021-02-01 15:18:23 236

原创每日一练28：移动端页面布局总结

效果图如下：只有中间内容滚动，头部红色定位在顶部，底部绿色背景定位在底部，只有中间内容滚动这个效果用的盒子模型写的，不用定位 <template> <div class="app"> <div class="top"> <p>我是top</p> </div> <div class="content"> <

2021-01-30 15:17:01 301

转载 css伪类有哪些？

伪类的语法： selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用。 selector.class : pseudo-class {property: value} 伪类连同伪元素一起，他们允许你不仅仅是根据文档 DOM 树中的内容对元素应用样式，而且还允许你根据诸如像导航历史这样的外部因素来应用样式（例如 :visited）。同样的，可以根据内容的状态（例如在一些表单元素上的 :checked），或者鼠标的位置（例如 :hover

2020-12-14 18:26:18 695

原创 Css的用法总结part3：css3弹性盒子模型

1：align-content属性定义：修改 flex-wrap 属性的行为，类似 align-items, 但不是设置子元素对齐，而是设置行对齐 2：align-items属性定义：设置弹性盒子元素在侧轴（纵轴）方向上的对齐方式。 3：align-self属性定义：在弹性子元素上使用。覆盖容器的 align-items 属性。 4：justify-content属性定义：设置弹性盒子元素在主轴（横轴）方向上的对齐方式。 5：flex-wrap...

2020-11-24 17:59:52 247

原创 Css的用法总结part2：column-count 属性、flex、columns、filter、font

1：column-count属性 Column-count属性指定某个元素应分为的列数。 Column-gap并指定一个30像素的列之间的差距 Column-rule指定列之间的规则：宽度，样式和颜色。简写：columns:100px 3; <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <.

2020-11-24 17:35:37 532

原创 Css的用法总结part1：sticky定位、align-content、backface-visibility、background

1：sticky定位用法：基于用户的滚动位置来定位 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <style> div.sticky { position: -webkit-sticky; position: sticky; top: 0; padding: 5px;.

2020-11-24 16:29:15 306

转载 axios学习日记Part2：常见传参方式get/post/put/patch/delete

参考：axios (get,post,delete,put,patch)用法 GET请求会向数据库发索取数据的请求，从而来获取信息，该请求就像数据库的select操作一样，只是用来查询一下数据，不会修改、增加数据，不会影响资源的内容，即该请求不会产生副作用。无论进行多少次操作，结果都是一样的。与GET不同的是，PUT请求是向服务器端发送数据的，从而改变信息，该请求就像数据库的update操作一样，用来修改数据的内容，但是不会增加数据的种类等，也就是说无论进行多少次PUT操作，其结果并没有不同。 .

2020-11-24 14:55:16 893

空空如也

空空如也