- 博客(30)
- 收藏
- 关注
原创 vue+echarts水球图制作
先在package.json里加入“echarts”“^4.2.0-rc.2”,“echarts-liquidfill”“^2.0.6”,然后npmi。
2022-07-18 10:29:35
411
原创 el-tree设置默认高亮,并在点击其他节点后取消高亮
html部分其中: @node-click=“handleClickChange”, current-node-key=“海淀区”和highlight-current为关键代码js部分在点击事件里将默认高亮的节点置空
2022-06-24 13:48:24
2241
原创 loca高德地图如何将后端传来的点位数据转换成geojson格式
以下例子取自https://lbs.amap.com/demo/loca-v2/demos/cat-scatter/sz-road黄色呼吸点的使用从官网复制代码时用的是他自带的geojson,用自己的数据是需要将url换成data打开后发现里面的格式是这样的(内容较长,只截取部分)而一般我们从后端拿到的接口数据是这样的接下来就是将我们的json用js代码转换一下格式根据上面的地址里的geojson格式一步一步改变我们自己的格式,注意每一个字段都要对上,不然点位可能就显示不出来。最后我们将得到的
2022-06-21 10:03:29
2287
2
原创 通过路由传值解决跨域传参问题
以在项目1中往用iframe嵌套的项目2传值为例:假设项目1地址为:http://localhost:3000/项目2地址为:http://localhost:3001/项目一 <iframe :src="url" frameborder="none" scrolling="none" style="width:100%;height:100vh"></iframe>data(){ return{ id: 0, //要传的id token: '', //要传
2022-05-31 15:04:46
89
原创 el-table滚动条设置在外层
问题当table数据量过大又不想用分页时,需要将纵向滚动条拉至底部才能操作横向滚动条,操作不便。因此我们需要固定横向滚动条的位置。失效的用法如果是如下结构,通常我们会选择隐藏el-table自带的滚动条,再给他的父级元素加上高度和滚动条。但是这种方法目前是没有用的。<div style="height:400px"> <el-table style="height:350px" /></div>可以采用的方法将table对应窗口位置固定html部分:
2022-05-31 14:27:08
1732
原创 el-form动态添加表单
html部分 <el-form :model="addForm" ref="addForm" label-width="100px" style="width:640px;margin:0 auto"> <div v-for="(i, index) in addForm.plus" style="position: relative"> <el-form-item label="名称" :key="`名称${ind
2022-05-31 14:10:56
1655
原创 更新一些好用的ui网站
1.https://mobbin.design/browse/ios/apps2.https://www.uplabs.com/这两个是可以直接下载的,第一个配色也会标出来,第二个部分免费下载3.https://dribbble.com/这个翻墙了也可以下载4.https://screenlane.com/5.https://www.siteinspire.com/这两个主要是借鉴一下找下灵感...
2022-04-23 15:08:30
101
原创 el-select动态清除value、el-input回车上传数据
1.el-select动态清除valuehtml部分:(重点看v-model) <el-select v-model="editForm.time" placeholder="选择时间" @change="selectBtn" > <el-option>xxx</el-option></el-selectdata部分 editForm: { time: "默认时
2022-04-23 15:06:06
1215
原创 cross-env 多项目环境配置
package.jsondevDependencies下安装 cross-env(添加好要npm i) "cross-env": "^7.0.3"scripts下(注意后面这个webpack.devyuyao.conf.js,是要添加的新文件)"dev-yuyao": "cross-env VUE_APP_SSO_URL=yuyao webpack-dev-server --inline --progress --config build/webpack.devyuyao.conf.js",w
2022-04-21 15:09:21
1994
原创 leaflet-地图去掉右上角图层
在getMap()里加入 document.getElementsByClassName( "leaflet-control-layers" )[0].style.visibility = "hidden";
2022-04-14 11:11:36
285
原创 vue组件之el-tree、el-select、el-autocomplete、el-table篇
1.el-tree 多选->单选html部分<el-tree @check="change" @ref="treeRef"></el-tree>methods部分change(data,checked,indeterminate){this.$ref.treeRef.setCheckedkeys([]);this.$ref.treeRef.setCheckedkeys([data.id]);}2.el-select 选中option之后没有立即生效ht
2022-04-14 11:07:15
1612
原创 vscode格式化失效问题
setting.json除了一些必要的配置,如 "eslint.autoFixOnSave": true, "editor.formatOnSave": true, "eslint.enable": true,等,容易疏漏的有: "eslint.options": { "extensions": [ ".js", ".jsx", ".vue", ".ts", ".tsx" ]
2022-03-28 14:23:59
3618
原创 antd column内width属性失效问题
在table组件中将scroll的x值设为100% <Table columns={columns} scroll={{ x: "100%"}} />
2021-11-08 16:07:12
512
原创 关于select和option下拉框样式问题
问题选项中的内容过长,导致下拉框长度变化,并且不能够显示所有内容。解决方法 <Form.Item label="xxx" name="xxx" > <Select placeholder="请选择" allowClear={true} style={{ width: "130px" }} > {industryType.map(item=> ( <Optio
2021-10-18 14:22:48
661
原创 antd组件英文改中文
英文版需要加入的代码1、引入中文包和ConfigProvid配置import zhCN from 'antd/es/locale/zh_CN';import { ConfigProvider } from 'antd'2.用ConfigProvid包裹需要汉化的组件 <ConfigProvider locale={zhCN}> <xxx组件> </ConfigProvider>效果(中文版)...
2021-01-25 09:22:07
1488
原创 关于报错:无法加载文件 D:\node\node_global\yarn.ps1,因为在此系统上禁止运行脚本的问题
1.右键VSCode图标,在属性中选择兼容性,再选择以管理员身份运行此程序。2.打开VSCode,打开终端。3.输入命令1get-ExecutionPolicy返回Restricted输入命令2set-ExecutionPolicy RemoteSigned输入命令3get-ExecutionPolicy返回RemoteSigned就OK了。...
2021-01-02 14:47:38
3486
1
原创 ES6 notes (part3)
函数的扩展函数参数的默认值ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面。rest 参数ES6 引入 rest 参数(形式为…变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数之后不能再有其他参数(即只能是最后一个参数),否则会报错。严格模式只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。name 属性如果将一个匿名函数赋值给一个变量,ES5 的name属性,会返回空字符串,而 E
2020-12-05 19:25:29
105
1
原创 ES6 notes (part4)
SymbolES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。凡是属性名属于 Symbol 类型,就都是独一无二的,可以保证不会与其他属性名产生冲突。let s = Symbol();typeof s// "symbol"Map & SetSetES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set本身是一个构造函数,用来生成 Set 数据结构。Set函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为
2020-12-05 19:25:20
65
原创 TypeScript notes
安装全局安装npm install -g typescript将 TypeScript 转换为 JavaScript 代码tsc 文件名.tstsc 常用编译参数如下表所示:类型任意类型 any:声明为 any 的变量可以赋予任意类型的值。数字类型 number:双精度 64 位浮点值。它可以用来表示整数和分数。字符串类型 string:一个字符系列,使用单引号(’)或双引号(")来表示字符串类型。反引号(`)来定义多行文本和内嵌表达式。布尔类型boolean:表示逻辑值:true
2020-12-05 19:25:05
123
原创 ES6 notes(part2)
扩展字符串的扩展字符的 Unicode 表示法将码点放入大括号:"\u{41}\u{42}\u{43}"字符串的遍历器接口ES6 为字符串添加了遍历器接口,使得字符串可以被for…of循环遍历。JavaScript 规定有5个字符,不能在字符串里面直接使用,只能使用转义形式U+005C:反斜杠(reverse solidus)U+000D:回车(carriage return)U+2028:行分隔符(line separator)U+2029:段分隔符(paragraph separ
2020-11-26 21:29:40
89
原创 promise&fetch
promisepromise状态pending(进行中)、fulfilled(已成功)和 rejected(已失败)。then方法then 方法接收两个函数作为参数,第一个参数是 Promise 执行成功时的回调,第二个参数是 Promise执行失败时的回调,两个函数只会有一个被调用。通过 .then 形式添加的回调函数,不论什么时候,都会被调用。fetchfetch 规范与 jQuery.ajax() 的区别:当接收到一个代表错误的 HTTP 状态码时,从 fetch() 返回
2020-11-26 21:29:06
233
原创 React onClick()三目运算/条件判断
错误写法<a onClick={条件?'window.open("网址1")':'window.open("网址2")'} > click me! </a>解决添加一个箭头函数 handle=()=>{ if(条件){ window.open("网址1") } else{ window.open("网址2") } }引入<a onClick={()=>
2020-11-05 21:10:13
1185
原创 react-router
配置npm install --save react-router react-router-dom编写组件import React from 'react';export default class Demo extends React.Component{ render(){ return( <div>demo</div> ); }}route在src下创建一个routes文件在该文件夹
2020-11-05 21:10:02
113
原创 react notes
创建create-react-app demo基本框架ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('root'));JSXJSX可以使用引号来定义以字符串为值的属性const element = <div tabIndex="0"></div>;也可以使用大括号来定义以JavaScript表达式为值的属性const element =
2020-11-05 21:09:50
89
原创 配置json-server
npm install -g joson-server创建一个放json文件的文件夹,然后cd到路径内初始化一个名为package的json文件npm init选项为:enter enter 描述自定义 enter enter enter enter enter enter enter再来装一下json-server模块并保存数据npm install json-server --save在文件夹中再创建一个db.json,内容自定义,最好包含多个属性。将package.json中
2020-10-24 13:17:17
129
原创 react-creat-app+antd
安装npx create-react-app democd到该文件路径下npm startnpm add antd引入1.在App.js中输入(例为按钮组件)import { button } from 'antd';const App = () => ( <div className="App"> <Button type="primary">Button</Button> </div>);代码在:htt
2020-10-24 13:15:37
146
原创 vue+json实现数据的导入
step 0 准备(此例子为用户管理系统)template中的代码为:<template> <div class="customers container"> <h1 class="page-header">用户管理系统</h1> <table class="table table-striped"> <thead> <tr> &l
2020-10-11 10:02:16
2403
原创 JQuery笔记
0.储备知识基本语法:$(selector).action()文档就绪:$(document).ready(function(){});或$(function(){});选择器:$("p")1.事件鼠标事件 :click、dbclick、hover、mouseenter、mouseleave例:$(selector).click(function)or$(selector).click()键盘事件:keypress、keydown、keyup例:$(selector).ke
2020-09-26 13:19:43
98
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人