vsCode 对未使用过的变量波浪线显示出
安装eslint插件,在项目的vsCode配置settings.json文件,
"javascript.validate.enable": true,
重新启动vscode生效
查看原文没有足够的数据
(゚∀゚ )
暂时没有任何数据
(゚∀゚ )
暂时没有任何数据
墨子鱼 发布了文章 · 2020-11-13
vsCode 对未使用过的变量波浪线显示出
安装eslint插件,在项目的vsCode配置settings.json文件,
"javascript.validate.enable": true,
重新启动vscode生效
查看原文vsCode 对未使用过的变量波浪线显示出安装eslint插件,在项目的vsCode配置settings.json文件, {代码...} 重新启动vscode生效
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-11-02
同步与异步的区别:
同步:
同步的思想是:所有的操作都做完,才返回给用户。这样用户在线等待的时间太长,给用户一种卡死了的感觉(就是系统迁移中,点击了迁移,界面就不动了,但是程序还在执行,卡死了的感觉)。这种情况下,用户不能关闭界面,如果关闭了,即迁移程序就中断了。
异步:
将用户请求放入消息队列,并反馈给用户,系统迁移程序已经启动,你可以关闭浏览器了。然后程序再慢慢地去写入数据库去。这就是异步。但是用户没有卡死的感觉,会告诉你,你的请求系统已经响应了。你可以关闭界面了。
promise all异步用法:
getType=(data)=>{
return new Promise(function(resolve, reject){
resolve(data); //输出数据
});
}
getHeader=(data)=>{
return new Promise(function(resolve, reject){
resolve(data); //输出数据
});
}
getList=(data1,data2)=>{
this.setState({
data1,
data2,
})
}
Promise.all([
this.getType(1),
this.getHeader(2)
]).then((results)=>{
var data1=results[0];
var data2=results[1];
this.getList(data1,data2);
})
查看原文同步的思想是:所有的操作都做完,才返回给用户。这样用户在线等待的时间太长,给用户一种卡死了的感觉(就是系统迁移中,点击了迁移,界面就不动了,但是程序还在执行,卡死了的感觉)。这种情况下,用户不能关闭界面,如果关闭了,即迁移程序就中断了。
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-11-02
npm基本命令
npm install xxx
安装xxx模块,但不记录到package.json里
npm install xxx@版本号
安装指定版本号的xxx模块
npm install --save xxx
安装xxx模块,并且记录到package.json里,字段对应的dependency,是产品环境必须依赖的模块
npm install --save-dev xxx
安装xxx模块,并且记录到package.json里,字段对应的dev-dependency,是开发环境必须依赖的模块
npm install --global xxx
全局安装xxx模块,不记录到package.json
npm uninstall xxx
删除xxx模块
npm uninstall -g xxx
全局删除xxx模块
npm基本命令npm install xxx安装xxx模块,但不记录到package.json里npm install xxx@版本号安装指定版本号的xxx模块npm install --save xxx安装xxx模块,并且记录到package.json里,字段对应的dependency,是产品环境必须依赖的模块npm install --save-dev xxx安装xx...
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-11-02
nodeJs文件写入与导出操作:
通过nodeJs内置的fs操作文件,获取本地json数据遍历格式化生成新的json数据导出到本地
var fs = require('fs'); //文件模块
var path = require('path'); //系统路径模块
//获取本地json文件
var file = path.join(__dirname, 'src/path.json');
var allArr=[];
//读取json文件
fs.readFile(file, 'utf-8', function(err, data) {
if (err) {
res.send('文件读取失败');
} else {
var newData=JSON.parse(data);
//格式化数据
for(let j=0;j<newData.length;j++){
let list=[];
var index=j*2;
if(newData[index]){
list.push(newData[index]);
list.push(newData[index+1]);
allArr.push(list);
}
}
var content = JSON.stringify(allArr);
//指定创建目录及文件名称,__dirname为执行当前js文件的目录
var file = path.join(__dirname, 'json/path.json');
//写入文件
fs.writeFile(file, content, function(err) {
if (err) {
return console.log(err);
}
console.log('文件创建成功,地址:' + file);
});
}});
path.json数据:
[
113.24253,23.17111,113.24288,23.17116,113.24297,23.17149,113.24243,23.17140,113.24227,23.17101,113.24205,23.17111,113.24189,23.17048
]
生成新的json文件:
[[113.24253,23.17111],[113.24288,23.17116],[113.24297,23.17149],[113.24243,23.1714],[113.24227,23.17101],[113.24205,23.17111],[113.24189,23.17048]]
生成新的json文件:[[113.24253,23.17111],[113.24288,23.17116],[113.24297,23.17149],[113.24243,23.1714],[113.24227,23.17101],[113.24205,23.17111],[113.24189,23.17048]]
赞 1 收藏 1 评论 0
墨子鱼 发布了文章 · 2020-11-01
一、mySql常用语句
1、新增数据库
CREATE TABLE sys_list
( id
bigint(20) NOT NULL AUTO_INCREMENT COMMENT '主键ID,自动递增', title
varchar(32) NOT NULL COMMENT '标题',content
varchar(200) NOT NULL COMMENT '内容', photo
varchar(32) NOT NULL COMMENT '图片',author
varchar(32) NOT NULL COMMENT '作者',type
enum('1','2') NOT NULL COMMENT '类型',createTime
TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,updateTime
TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (id
) ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
2、新增一条数据
insert into sys_list values(1,'标题1','内容1','','2020-10-07','2020-10-07')
3、查询一条数据
select * from sys_brand d where d.id=1 //通过id查询
select * from sys_brand d where d.title like '%标%' //通过title模糊查询
4、修改一条数据
update sys_list set title='标题11',content='内容11' where id='1'
5、删除一条数据
delete from sys_list where id='1'
6、复制表到另外的数据库
create table sys_user select * from my_test.sys_user;
CREATE TABLE sys_list ( id bigint(20) NOT NULL AUTO_INCREMENT COMMENT '主键ID,自动递增', title varchar(32) NOT NULL COMMENT '标题',content varchar(200) NOT NULL COMMENT '内容', photo varchar(32) NOT NULL COMMENT '图片',author varchar(32) NOT NULL...
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-10-31
NodeJS全栈开发之后端实现上传文件功能并保存到Mysql数据库
安装第三方插件multer
npm i --save multer
创建上传接口文件upload.js
var createFolder = function(folder){
try{
fs.accessSync(folder);
}catch(e){
fs.mkdirSync(folder);
}
};
var uploadFolder = './uploads/'; //文件上传位置
createFolder(uploadFolder);
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, uploadFolder)
},
filename: function (req, file, cb) {
cb(null, file.originalname)
}
})
var upload = multer({ storage: storage })
//上传接口
router.post('/upload', upload.single('file'), function(req, res) {
fs.rename(req.file.path, "uploads/" + req.file.originalname, function(err) {
if (err) {
throw err;
}
var data= req.file
var photo=req.file.url
res.send({
code:CODE_SUCCESS,
msg:'上传成功',
data:data
})
//添加到数据库
const query = `insert into sys_data(photo) values( '${photo}')`;
querySql(query)
.then(data => {
res.json({
code: CODE_SUCCESS,
msg: '添加数据成功',
data: null
})
})
})
})
module.exports = router
通过postman测试上传接口
查看原文NodeJS全栈开发之后端实现上传文件功能并保存到Mysql数据库安装第三方插件multernpm i --save multer创建上传接口文件upload.jsvar createFolder = function(folder){ {代码...} };var uploadFolder = './uploads/'; //文件上传位置createFolder(uploadFolder);var s...
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-10-30
react使用gg-editor编辑可视化流程,有保存按钮
安装gg-editor与@ant-design/icons
npm i gg-editor@2.0.2
npm i @ant-design/icons
引入对应的页面
import GGEditor, { Mind,Toolbar,Command,Item,ItemPanel,Flow} from "gg-editor";
import Save from "./ggSave";
import ToolbarButton from './ToolbarButton';
import FlowDetailPanel from './FlowDetailPanel';
import FlowContextMenu from './FlowContextMenu'
相关代码:
<GGEditor className='editor '>
<Save />
<Row className="editorHd">
<Col span={24}>
<Toolbar className='toolbar'>
<ToolbarButton command="undo" />
<ToolbarButton command="redo" />
<Divider type="vertical" />
<ToolbarButton command="copy" />
<ToolbarButton command="paste" />
<ToolbarButton command="delete" />
<Divider type="vertical" />
<ToolbarButton command="zoomIn" icon="zoom-in" text="Zoom In" />
<ToolbarButton command="zoomOut" icon="zoom-out" text="Zoom Out" />
<ToolbarButton command="autoZoom" icon="fit-map" text="Fit Map" />
<ToolbarButton command="resetZoom" icon="actual-size" text="Actual Size" />
<Divider type="vertical" />
<ToolbarButton command="toBack" icon="to-back" text="To Back" />
<ToolbarButton command="toFront" icon="to-front" text="To Front" />
<Divider type="vertical" />
<ToolbarButton command="multiSelect" icon="multi-select" text="Multi Select" />
<ToolbarButton command="addGroup" icon="group" text="Add Group" />
<ToolbarButton command="unGroup" icon="ungroup" text="Ungroup" />
</Toolbar>
</Col>
</Row>
<Row className="editorHd">
<Col span={4} className="editorSidebar">
<ItemPanel className="itemPanel">
<Card bordered={false}>
<Item
type="node"
size="72*72"
shape="flow-circle"
model={{
color: '#FA8C16',
label: 'Start',
}}
data-original="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxjaXJjbGUgaWQ9ImIiIGN4PSIzNiIgY3k9IjM2IiByPSIzNiIvPjxmaWx0ZXIgeD0iLTkuNyUiIHk9Ii02LjklIiB3aWR0aD0iMTE5LjQlIiBoZWlnaHQ9IjExOS40JSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iYSI+PGZlT2Zmc2V0IGR5PSIyIiBpbj0iU291cmNlQWxwaGEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIi8+PGZlR2F1c3NpYW5CbHVyIHN0ZERldmlhdGlvbj0iMiIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIi8+PGZlQ29tcG9zaXRlIGluPSJzaGFkb3dCbHVyT3V0ZXIxIiBpbjI9IlNvdXJjZUFscGhhIiBvcGVyYXRvcj0ib3V0IiByZXN1bHQ9InNoYWRvd0JsdXJPdXRlcjEiLz48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMDQgMCIgaW49InNoYWRvd0JsdXJPdXRlcjEiLz48L2ZpbHRlcj48L2RlZnM+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0IDIpIj48dXNlIGZpbGw9IiMwMDAiIGZpbHRlcj0idXJsKCNhKSIgeGxpbms6aHJlZj0iI2IiLz48dXNlIGZpbGwtb3BhY2l0eT0iLjkyIiBmaWxsPSIjRkZGMkU4IiB4bGluazpocmVmPSIjYiIvPjxjaXJjbGUgc3Ryb2tlPSIjRkZDMDY5IiBjeD0iMzYiIGN5PSIzNiIgcj0iMzUuNSIvPjwvZz48dGV4dCBmb250LWZhbWlseT0iUGluZ0ZhbmdTQy1SZWd1bGFyLCBQaW5nRmFuZyBTQyIgZm9udC1zaXplPSIxMiIgZmlsbD0iIzAwMCIgZmlsbC1vcGFjaXR5PSIuNjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQgMikiPjx0c3BhbiB4PSIyMyIgeT0iNDEiPlN0YXJ0PC90c3Bhbj48L3RleHQ+PC9nPjwvc3ZnPg=="
/>
<Item
type="node"
size="80*48"
shape="flow-rect"
model={{
color: '#1890FF',
label: 'Normal',
}}
data-original="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODgiIGhlaWdodD0iNTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxyZWN0IGlkPSJiIiB4PSIwIiB5PSIwIiB3aWR0aD0iODAiIGhlaWdodD0iNDgiIHJ4PSI0Ii8+PGZpbHRlciB4PSItOC44JSIgeT0iLTEwLjQlIiB3aWR0aD0iMTE3LjUlIiBoZWlnaHQ9IjEyOS4yJSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iYSI+PGZlT2Zmc2V0IGR5PSIyIiBpbj0iU291cmNlQWxwaGEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIi8+PGZlR2F1c3NpYW5CbHVyIHN0ZERldmlhdGlvbj0iMiIgaW49InNoYWRvd09mZnNldE91dGVyMSIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIi8+PGZlQ29tcG9zaXRlIGluPSJzaGFkb3dCbHVyT3V0ZXIxIiBpbjI9IlNvdXJjZUFscGhhIiBvcGVyYXRvcj0ib3V0IiByZXN1bHQ9InNoYWRvd0JsdXJPdXRlcjEiLz48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAuMDQgMCIgaW49InNoYWRvd0JsdXJPdXRlcjEiLz48L2ZpbHRlcj48L2RlZnM+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0IDIpIj48dXNlIGZpbGw9IiMwMDAiIGZpbHRlcj0idXJsKCNhKSIgeGxpbms6aHJlZj0iI2IiLz48dXNlIGZpbGwtb3BhY2l0eT0iLjkyIiBmaWxsPSIjRTZGN0ZGIiB4bGluazpocmVmPSIjYiIvPjxyZWN0IHN0cm9rZT0iIzE4OTBGRiIgeD0iLjUiIHk9Ii41IiB3aWR0aD0iNzkiIGhlaWdodD0iNDciIHJ4PSI0Ii8+PC9nPjx0ZXh0IGZvbnQtZmFtaWx5PSJQaW5nRmFuZ1NDLVJlZ3VsYXIsIFBpbmdGYW5nIFNDIiBmb250LXNpemU9IjEyIiBmaWxsPSIjMDAwIiBmaWxsLW9wYWNpdHk9Ii42NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNCAyKSI+PHRzcGFuIHg9IjIxIiB5PSIyOSI+Tm9ybWFsPC90c3Bhbj48L3RleHQ+PC9nPjwvc3ZnPg=="
/>
<Item
type="node"
size="80*72"
shape="flow-rhombus"
model={{
color: '#13C2C2',
label: 'Decision',
}}
data-original="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODYiIGhlaWdodD0iNzgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxwYXRoIGQ9Ik00Mi42NyAxLjY3bDM0Ljk2NSAzMS4zNTJhNCA0IDAgMCAxIDAgNS45NTZMNDIuNjcgNzAuMzNhNCA0IDAgMCAxLTUuMzQgMEwyLjM2NSAzOC45NzhhNCA0IDAgMCAxIDAtNS45NTZMMzcuMzMgMS42N2E0IDQgMCAwIDEgNS4zNCAweiIgaWQ9ImIiLz48ZmlsdGVyIHg9Ii04LjglIiB5PSItNi45JSIgd2lkdGg9IjExNy41JSIgaGVpZ2h0PSIxMTkuNCUiIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaWQ9ImEiPjxmZU9mZnNldCBkeT0iMiIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSIvPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMSIvPjxmZUNvbXBvc2l0ZSBpbj0ic2hhZG93Qmx1ck91dGVyMSIgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9Im91dCIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIi8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwLjA0IDAiIGluPSJzaGFkb3dCbHVyT3V0ZXIxIi8+PC9maWx0ZXI+PC9kZWZzPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAxKSI+PHVzZSBmaWxsPSIjMDAwIiBmaWx0ZXI9InVybCgjYSkiIHhsaW5rOmhyZWY9IiNiIi8+PHVzZSBmaWxsLW9wYWNpdHk9Ii45MiIgZmlsbD0iI0U2RkZGQiIgeGxpbms6aHJlZj0iI2IiLz48cGF0aCBzdHJva2U9IiM1Q0RCRDMiIGQ9Ik00Mi4zMzcgMi4wNDJhMy41IDMuNSAwIDAgMC00LjY3NCAwTDIuNjk4IDMzLjM5NGEzLjUgMy41IDAgMCAwIDAgNS4yMTJsMzQuOTY1IDMxLjM1MmEzLjUgMy41IDAgMCAwIDQuNjc0IDBsMzQuOTY1LTMxLjM1MmEzLjUgMy41IDAgMCAwIDAtNS4yMTJMNDIuMzM3IDIuMDQyeiIvPjwvZz48dGV4dCBmb250LWZhbWlseT0iUGluZ0ZhbmdTQy1SZWd1bGFyLCBQaW5nRmFuZyBTQyIgZm9udC1zaXplPSIxMiIgZmlsbD0iIzAwMCIgZmlsbC1vcGFjaXR5PSIuNjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMgMSkiPjx0c3BhbiB4PSIxOCIgeT0iNDIiPkRlY2lzaW9uPC90c3Bhbj48L3RleHQ+PC9nPjwvc3ZnPg=="
/>
<Item
type="node"
size="80*48"
shape="flow-capsule"
model={{
color: '#722ED1',
label: 'Model',
}}
data-original="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODgiIGhlaWdodD0iNTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxkZWZzPjxyZWN0IGlkPSJiIiB4PSIwIiB5PSIwIiB3aWR0aD0iODAiIGhlaWdodD0iNDgiIHJ4PSIyNCIvPjxmaWx0ZXIgeD0iLTguOCUiIHk9Ii0xMC40JSIgd2lkdGg9IjExNy41JSIgaGVpZ2h0PSIxMjkuMiUiIGZpbHRlclVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgaWQ9ImEiPjxmZU9mZnNldCBkeT0iMiIgaW49IlNvdXJjZUFscGhhIiByZXN1bHQ9InNoYWRvd09mZnNldE91dGVyMSIvPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiIHJlc3VsdD0ic2hhZG93Qmx1ck91dGVyMSIvPjxmZUNvbXBvc2l0ZSBpbj0ic2hhZG93Qmx1ck91dGVyMSIgaW4yPSJTb3VyY2VBbHBoYSIgb3BlcmF0b3I9Im91dCIgcmVzdWx0PSJzaGFkb3dCbHVyT3V0ZXIxIi8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwLjA0IDAiIGluPSJzaGFkb3dCbHVyT3V0ZXIxIi8+PC9maWx0ZXI+PC9kZWZzPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNCAyKSI+PHVzZSBmaWxsPSIjMDAwIiBmaWx0ZXI9InVybCgjYSkiIHhsaW5rOmhyZWY9IiNiIi8+PHVzZSBmaWxsLW9wYWNpdHk9Ii45MiIgZmlsbD0iI0Y5RjBGRiIgeGxpbms6aHJlZj0iI2IiLz48cmVjdCBzdHJva2U9IiNCMzdGRUIiIHg9Ii41IiB5PSIuNSIgd2lkdGg9Ijc5IiBoZWlnaHQ9IjQ3IiByeD0iMjMuNSIvPjwvZz48dGV4dCBmb250LWZhbWlseT0iUGluZ0ZhbmdTQy1SZWd1bGFyLCBQaW5nRmFuZyBTQyIgZm9udC1zaXplPSIxMiIgZmlsbD0iIzAwMCIgZmlsbC1vcGFjaXR5PSIuNjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQgMikiPjx0c3BhbiB4PSIyNCIgeT0iMjkiPk1vZGVsPC90c3Bhbj48L3RleHQ+PC9nPjwvc3ZnPg=="
/>
</Card>
</ItemPanel>
</Col>
<Col span={16} className="editorContent">
<Flow className="flow" />
</Col>
<Col span={4} className="editorSidebar">
<FlowDetailPanel />
</Col>
</Row>
<FlowContextMenu />
</GGEditor>
项目效果截图:
安装gg-editor与@ant-design/iconsnpm i gg-editor@2.0.2npm i @ant-design/icons
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-10-30
//异步获取本地json文件
handleJson=(name)=>{
return new Promise((resolve,reject)=>{
axios.get(`/border/${name}.json`).then(
function(data){
resolve(data)
}
)
})
}
//循环变量获取对应json文件
handleBorderData=()=>{
var {districts}=this.state;
_.forEach(districts,(item)=>{
var name=item.codeName
this.handleJson(name).then((data)=>{
gzData[item.code]=data.data
console.log('gzData',gzData[item.code][0])
})
})
}
async componentDidMount(){
await this.handleBorderData();
}
查看原文{代码...}
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-10-30
当type为1是不显示‘操作’列
filter写在这里页面初始化只执行一次
this.columns = [
{
title: '姓名',
dataIndex: 'xm',
key: 'xm',
},
{
title: '操作',
dataIndex: 'handle',
key: 'handle',
},
].filter((item)=>{
if(this.state.type==1){
return item.title!="操作"
}else{
return item
}
})
放在<Table columns={this.columns.filter((item)=>{
if(this.state.type==1){
return item.title!="操作"
}else{
return item
}
}} 根据state type的改变而执行
查看原文当type为1是不显示‘操作’列 {代码...} 放在<Table columns={this.columns.filter((item)=>{ {代码...}
赞 0 收藏 0 评论 0
墨子鱼 发布了文章 · 2020-10-30
ArcGIS for JS argis地图限制显示不规则区域
dojoRequire(["esri/map",
"esri/geometry/Point",
"esri/layers/ImageParameters",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/GraphicsLayer", ], (Map, Point, ImageParameters, ArcGISDynamicMapServiceLayer,GraphicsLayer) => {
//方法一
var map = new Map("map", {
basemap: "satellite",
center: [113.36112, 23.12467],
zoom: 11,
});
var imageParameters = new ImageParameters();
imageParameters.format = "PNG24";
var dynamicMapServiceLayer = new ArcGISDynamicMapServiceLayer("http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer", {
"opacity" :1.0,
"imageParameters":imageParameters
});
map.addLayer(dynamicMapServiceLayer);
var canvas=document.getElementById("myCanvas");
var context=canvas.getContext("2d");
canvas.width = width
canvas.height = height
context.fillStyle="#fff";
context.fillRect(0,0,width,height);
axios.get(`/borderAll/test.json`).then(
function (gzJson) {
var data=gzJson.data;
context.globalCompositeOperation='destination-out';
for (var item of data) {
var [lon, lat] = item
var [left,top] = this.lngLat2Vector2(lon,lat)
context.lineTo(left, top);
}
context.fillStyle="green";
context.fill();
}.bind(this)
);
})
<div>
<div id='map' style={{height:window.innerHeight-50,width:'100%',position:'relative'}}></div>
<canvas id="myCanvas" className='shadediv' />
</div>
test.json为不规则路径的边界经纬度
查看原文ArcGIS for JS argis地图限制显示不规则区域 {代码...} test.json为不规则路径的边界经纬度
赞 0 收藏 0 评论 0
查看全部 个人动态 →
(゚∀゚ )
暂时没有
(゚∀゚ )
暂时没有
注册于 2020-05-18
个人主页被 745 人浏览
推荐关注