![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 83
盛桃云
Java、Python、前端、运维等技能分享
展开
-
在vue-cli2 中使用 ant design vue
在vue-cli中使用 ant design vue一、按照 vue-cli 工具npm install -g @vue/cli二、新建要给 vue 项目vue create antd-demo选择 Default ([Vue 2] babel, eslint),等待项目创建完成进入项目,并启动cd antd-demonpm run serve三、引入 antdnpm install ant-design-vue --save1、修改 src/main.js,引入 ant原创 2020-10-28 20:00:57 · 2811 阅读 · 0 评论 -
Java压缩html
web页面静态化时,也会需要将html文本内容做压缩处理,如下:pom.xml<dependency> <groupId>com.googlecode.htmlcompressor</groupId> <artifactId>htmlcompressor</artifactId> <version>1.5.2</version></dependency><dependency>原创 2020-09-20 17:59:13 · 859 阅读 · 0 评论 -
mxgraph
地址https://github.com/jgraph/mxgraphdemohttps://app.diagrams.net/原创 2020-07-03 15:55:55 · 212 阅读 · 0 评论 -
文本模板模式用于解决thymeleaf模板中输出js的需求
需要从后台模型变量中存储的 js 脚本输出到页面上,常见的语法都解决不了,后来在官网提供的Using Thymeleaf 的pdf教程看到:13 Textual template modesThree of the Thymeleaf template modes are considered textual: TEXT , JAVASCRIPT and CSS . This differ...原创 2020-03-08 16:11:21 · 709 阅读 · 0 评论 -
微信小程序开发系列三 小程序页面渲染
一、事件处理// index.wxml<view bindtap="myclick">点击我</view>// index.jsPage({ myclick: function(){ console.log("clicked") }})bind开头的事件不会阻止事件冒泡,catch开头的事件会阻止事件冒泡二、更新数据小程序在Page对...原创 2020-01-12 23:43:32 · 1288 阅读 · 0 评论 -
微信小程序开发系列二 小程序开发基础
一、基本目录结构pages |-- index |-- index.js |-- index.json |-- index.wxml |-- index.wxssapp.js 小程序逻辑文件,不可缺少app.json 小程序全局配置文件,不可缺少app.wxss 全局样式project.config....原创 2020-01-12 23:07:20 · 156 阅读 · 0 评论 -
微信小程序开发系列一 开发者工具
开发者工具常用快捷键:Ctrl + Shift + F 全局搜索Shift + Alt + F 代码格式化Alt + 向上箭头 上移一行Alt + 向下箭头 下移一行Shift + Alt + 向上箭头 向上复制一行Shift + Alt + 向下箭头 向下复制一行另外,可以尝试开发者工具的调试功能,可以在真机环境下触发开发者工具的调试能力...原创 2020-01-12 22:17:45 · 241 阅读 · 0 评论 -
java实现html转pdf
java实现将html网页转pdf,如果需求只是将一些简单的html元素转成pdf,那么使用 itext 或者FlyingSaucer 就可以搞定,但是真正的网页url类型的html涉及到的 html 语法和 css语法实在是太复杂,itext 和FlyingSaucer 根本没法搞定。最后发现使用 phantomjs 可以完美将html转换为pdf,大概思路如下:一、下载phanto...原创 2019-10-16 11:19:20 · 2061 阅读 · 0 评论 -
nodejs实现rest接口
nodejs可以用来实现简单的server及rest接口,可适用于某些简单的场景。当然nodejs也可以读取mongo、mysql等数据库。本文简单介绍nodejs通过读写文件来实现rest接口。需要提前安装好nodejs环境,可参照本博客的其他文章。一、get请求准备文件 users.json,内容如下:{ "user1" : { "id": 1, ...原创 2019-07-19 23:35:52 · 3152 阅读 · 0 评论 -
web程序送消息给闸机的串口实现人脸识别自动开闸
前几篇文章介绍了人脸识别的技术思路,本文介绍web程序实现人脸识别成功后的自动开闸机的技术实现思路。一、实现思路要触发闸机的自动开闸,必须给闸机发送开闸的消息。而闸机的通讯协议一般是采用RS232串口的标准协议。也就是说必须与闸机的RS232串口发送消息,而web程序是不能与本地的硬件进行通讯的,那web程序与串口发生消息交互就需要借助中间的服务提供消息的传递,下面是主要的技术思路:...原创 2019-06-04 00:21:27 · 1947 阅读 · 1 评论 -
vue学习之三 视图中的指令 v-if 和 v-for
vue的视图指令有v-on, v-bind, v-if, v-for 等等,只要是以 v- 开头的都是指令Directive。指令中都要使用表达式一、v-ifscript内容添加 age 的定义: data () { return { message: 'hi, 我的第一个vue程序', age: 19 } }模板内容添加:<...原创 2019-06-09 23:10:34 · 750 阅读 · 0 评论 -
vue学习之二 页面中方法的声明和调用
上一篇文章中介绍的vue页面Hi.vue文件中介绍了变量的声明和调用,本文介绍方法的声明和调用。修改Hi.vue文件script部分的内容,声明方法showMessage:<script>export default { data () { return { message: 'hi, 我的第一个vue程序' } }, method:...原创 2019-06-09 22:36:27 · 997 阅读 · 0 评论 -
vue学习之一 vscode开发第一个vue项目
vue前端框架使用越来越多,而vscode作为前端开发IDE环境也使用越来越普遍,本文结合vscode介绍vue开发第一个vue项目。开发vue需要依赖于nodejs,本博客有介绍nodejs的安装,本文就不再做介绍。一、安装vue及依赖执行npm命令安装webpacknpm install webpack -g再安装vuenpm install vue vue-cli -...原创 2019-06-09 18:54:43 · 11961 阅读 · 1 评论 -
win7下安装nodejs
一、下载安装nodejshttps://nodejs.org/en/ 下载最新版, 安装到 D:\Program\nodejs (安装目录最好不带空格)在安装目录下新建 node_cache 和 node_global 两个目录在命令行下输入:npm config set prefix D:\Program\nodejs\node_globalnpm config set ca...原创 2019-06-08 17:17:40 · 16569 阅读 · 1 评论 -
centos6下安装node及编译vue项目
一、安装nodejs访问nodejs的官网下载页 https://nodejs.org/en/download/,找到linux版本可以下载源码或编译后的版本。本文介绍编译版本的安装,可以将安装包下载下来再传到服务器,也可以复制链接地址,在服务器上使用wget命令下载,如wget https://nodejs.org/dist/v10.15.3/node-v10.15.3-linu...原创 2019-05-22 16:25:08 · 840 阅读 · 0 评论 -
webrtc之三 iceServer
webrtc建立点对点的对等连接需要用到iceServers参数,可以使用公开免费的一些ice服务器资源,也可以使用开源程序自己搭建ice server,找了一些资源供参考:1、IceBoxhttps://doc.zeroc.com/ice/latest/iceboxhttps://blog.csdn.net/u011784767/article/category/7006667 这...原创 2019-05-04 18:45:36 · 17853 阅读 · 1 评论 -
webrtc之二 getUserMedia和canvas
上一篇介绍了webrtc的getUserMedia,本文结合getUserMedia和canvas介绍浏览器调用摄像头实现拍照<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=ed...原创 2019-05-04 08:57:56 · 919 阅读 · 0 评论 -
webrtc之一 getUserMedia
WebRTC最基本的功能是对视频和音频的控制,本文介绍getUserMedia对摄像头的控制<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <m...原创 2019-05-03 23:37:13 · 1075 阅读 · 1 评论 -
实现给图片添加放大镜,点击后全屏显示的功能
有时候页面显示的图片看不清,希望点击后放大查看,只是实现这样的一个功能比较简单,但是如果要将所有的图片统一加上点击放大的功能,就有点难度。本文给出一个解决该问题的例子,实现鼠标移动到图片上时鼠标自动变为带加号的放大镜,点击后可以将图片放大成全屏显示,手机上也兼容。效果:image-zoom.js(function() { // 文档图片放大查看 imgZoom();...原创 2019-03-16 23:59:52 · 3332 阅读 · 0 评论