最近入坑小程序，要求在小程序的输入框中展示一个小图标，页面如下:然后按照，html页面中的做法，在input框中添加了background-image属性，出乎意料的事，小程序报了下边这样一个错误:emmmm 好像小程序的background-image属性并不给力啊，然后查阅相关资料后，放弃了background-image属性。 然后另辟蹊径，由于小程序中，好像只有image标签才能加载本地图片，所以考虑使用image标签来实现，大致思路就是在一个view中，左边是image,...
主要用于将数据库中日期用long表示，转换成YYYY-MM-DD格式或YYYY-MM-DD HH:mm:ss格式 若显示为YYYY-MM-DD HH:mm:ss格式，调用如下方法： datetimeFormat(longTypeDate); 若显示为YYYY-MM-DD格式，调用如下方法： dateFormat(longTypeDate); Js中具体方法如下：/* * 时间格式化工具 * 把Long类型的1527672756454日期还原yyyy-MM-dd 00:00:00格式日期 */ function datetimeFormat(longTypeDate){ var dateTypeDate = ""; var dat...
最近要写一个工具界面整合项目的功能属性，方便其他部门的人进行编辑，有点类似后台。会有部分数据上的交互。于是学习了下node.js后端的知识。 源码如下： // filename:myServer.js // a simple http server varfs = require(fs),url = require(url),path = require(path),http = require(http);//从命令行参数获取root目录，默认是当前目录 var root = path.resolve(process.argv[2] || .); console.log(Static root dir: + root...
1.安装环境 ①安装node.js 并添加入环境变量PATH②安装淘宝NPM镜像$ npm install -g cnpm --registry=https://registry.npm.taobao.org③安装webpacknpm install webpack -g ④安装vue-cli脚手架npm install -g vue-cli⑤创建项目模板 vue init wepack vue-multipage-demo⑥cmd进入到要放项目的文件夹⑦安装 cnpm install2.目录结构调整 3.配置文件修改 ①添加依赖 glob （返回目录中的所有子文件） npm install glob②修改build文...
在开发webapp的时候总是会受到首屏加载时间过长的影响，主流的解决方法是在载入完成之前显示loading图效果，而一些大公司会配置一套服务端渲染的架构来解决这个问题。考虑到ssr所要解决的一系列问题，越来越多的APP采用了“骨架屏”的方式去提升用户体验。 小米商城：一、分析Vue页面的内容加载过程 vue项目中的入口index.html只有简单的内容： <!DOCTYPE html> <html lang="zh-CN"> <head><meta http-equiv="Content-Type" conten...
Vue这个框架就不简单介绍了，它最大的特性就是数据的双向绑定以及虚拟dom.核心就是用数据来驱动视图层的改变.先看一段代码. 一、示例 var vm = new Vue({ data: { obj: { a: 1 } }, created: function () { console.log(this.obj); } }); 二、实现原理 vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的.1）数据劫持、vue是通过Object.defineProperty()来实现数据劫持，其中会有getter()和setter方法；当读取...
在vue官网把文档扫了一遍后，就开始写网站项目了，没有设计，就百度里找了一个h5的助赢软件的网站把他copy下来，想想有点坏了，接着把内容改改吧。首先开始做一个列表展示vue实例好后，给对象添加默认数据，列表加载成功。查看源代码，看看是否和心目中想的一样。当前还只是把初始化的默认数组展示出来，列表里面的操作，跳转还没有加，试着给初始化的数组添加id字段和数字刷新一下，没有效果，坑人的Chrome，缓存特别严重，不得不...
一： 首先在nodejs项目里创建一个server.js文件，输入下面代码 var http = require("http"); http.createServer(function(request, response) { response.writeHead(200, {"Content-Type": "text/plain"}); response.write("Hello World"); response.end(); }).listen(8888); 然后在cmd下进入项目路径，再输入node server.js启动服务器，然后在浏览器地址栏中输入http://localhost:8888/即可在界面上看到输出Hello World，如果我...
javascript 跨域是一个很常见的问题，其中 jsonp 是一个最常用的手段，但是 jsonp 只支持 get，不支持 post，所以如果想通过 jsonp 来 post 一些数据，就头大了。 此处通过在一个 iframe 中生成 form 表单的形式来实现 post，并通过 postMessage 来向调用者返回值。 第一步，我们先实现一个接受 jsonp 的后端代码，至于用什么语言实现，各位自已决定。 c#代码是： protected void Page_Load(object sender, EventArgs e){StringBui...
什么是 WebSocket ？WebSocket 是一种标准协议，用于在客户端和服务端之间进行双向数据传输。但它跟 HTTP 没什么关系，它是基于 TCP 的一种独立实现。 以前客户端想知道服务端的处理进度，要不停地使用 Ajax 进行轮询，让浏览器隔个几秒就向服务器发一次请求，这对服务器压力较大。另外一种轮询就是采用 long poll 的方式，这就跟打电话差不多，没收到消息就一直不挂电话，也就是说，客户端发起连接后，如果没消息，就一直不返回 R...
Element-UI 的 Table 组件很强大，但是我们的需求更强大... 简单粗暴的来一发效果图：一、数据驱动 传统的拖动效果，都是基于通过 mousedown、mousemove、mouseup 事件来修改删减 dom 节点 但 Vue 是一个数据驱动的前端框架，开发时应尽量避免操作 dom 而且 Element-UI 的 Table 组件封装得很严谨，直接操作 dom 很容易产生不可预计的 bug 所以我的核心思路就是：通过一个数组渲染表头（列），然后修改这个数组的顺序，从而修改列表...
什么是VuePress VuePress由两部分组成：一个基于Vue的轻量级静态网站生成器，以及为编写技术文档而优化的默认主题。 它是为了满足Vue自己的子项目文档的需求而创建的。 VuePress为每一个由它生成的页面提供预加载的html，不仅加载速度极佳，同时对seo非常友好。一旦页面被加载之后，Vue就全面接管所有的静态内容，使其变成一个完全的SPA应用，其他的页面也会在用户使用导航进入的时候来按需加载。 VuePress是怎样运作的 一个VuePre...
前言 最近在写插件的过程中，需要使用 JS 判断是否有滚动条，搜了一下，大致方法都差不多，但都有些啰嗦，代码不够简洁。最终通过参考不同方法，写了一个比较简单的方法。在判断滚动条的同时也需要计算滚动条的宽度，通过本篇文章一并与大家分享。 为什么要判断滚动条判断滚动条的需求在弹窗插件中用的较多，因为弹窗大多会添加 overflow: hidden 的属性，如果页面比较长的话，添加这个属性之后页面会有晃动。 为了增强用户体验，通...
实例如下所示： $(document).on(change, .photo-box .file, function () {//alert($(this).val());function getObjectURL(file) {var url = null;if (window.createObjectURL != undefined) { // basicurl = window.createObjectURL(file);} else if (window.URL != undefined) { // mozilla(firefox)url = window.URL.createObjectURL(file);} else if (window.webkitURL != undefined) { // webkit or chromeurl = window.webkit...
Vue定义全局点击函数，参数为点击的回调函数。 Vue.prototype.globalClick = function (callback) { //页面全局点击$(document).click(callback); }组件挂载后监听全局的点击事件 mounted:function () {this.globalClick(this.handleClickOut); },隐藏元素。 取到dom节点，判断父级是否存在来判断是否需要来关闭 handleClickOut:function (event) {if($(event.target).parents(".sys-add-user-dialog").length == 0){//隐藏元素} }...