需求背景最近有个需求，需要在项目中添加一个消息通知弹窗，告知用户一些信息。用户看过消息后，就不再弹窗了。 问题很明显，这个需要后端的介入，提供相应的接口（这样可扩展性更好）。 在开发过程中，遇到个问题：由于我们的系统是多页面的，所以每次切换页面，都会去请求后端的消息接口。。有一定的性能损耗。 因为是多页面系统，使用单例组件貌似也没啥意义（不过是个机会学习学习单例组件是怎么写的）。 于是，想到使用浏览器...
有时候我们需要从文件中读取数据。在以前，你需要将其发送到服务器，然后返回所需的数据。问题是，现在我们还可以使用 FileReader API 直接访问浏览器中的文件。 如果我们只是想读取一个文本文件，以便在UI级别上做一些无关紧要的事情，那么就不需要将文件发送到服务器。下面的示例将实现从一个文件中读取相关的数据填充到一个 textarea 中。 FileReader API FileReader API提供了一个很好的接口，可以使用文本或Blob对象类型以不同...
当我们在写jsp页面时，往往会遇到这种情况：从后台获取的数据个数不确定，此时在前端写jsp页面时也就不确定怎么设计了。这个时候就需要通过js动态创建标签： 1.创建某个标签：如下在body中创建一个div的事例； <script>function fun(){var frameDiv = document.createElement("div");//创建一个标签var bodyFa = document.getElementById("bodyid");//通过id号获取frameDiv 的父类（也就是上一级的节点）bodyFa .appendChild(frame...
创建组件的两种方法小结 1.全局注册 2.局部注册 var child=Vue.extend({}) var parent=Vue.extend({}) Vue.extend() 全局方法 生成构造器，创建子类 使用基础 Vue 构造器，创建一个“子类”。 这样写非常繁琐。于是vue进行了简化 使用Vue.component()直接创建和注册组件： Vue.component(id,options) 全局方法 用来注册全局组件 id 是string类型，即是注册组件的名称 options 是个对象 // 全局注册，my-component1是标签名称 Vue....
1、安装vue-cli cnpm install vue-cli -g --执行全局安装 2、创建一个webpack的基础项目；命令：vue init webpack myproject;以下是项目的目录结构及说明build是webpack配置build.js // 生产环境构建代码check-versions.js // 检查node&npm等版本utils.js // 构建配置公用工具vue-loader.conf.js // vue加载器webpack.base.conf.js // webpack基础环境配置webpack.dev.conf.js // webpack开发环境配置webpack....
今天看到这样一道题： 填写"TO DO"处的内容让下面代码支持a.name = "name1"; b.name = "name2";function Obj(name){ // TO DO } obj. /* TO DO */ = "name2"; var a = Obj("name1"); var b = new Obj; 问题1:new操作符做了些什么呢？ 创建一个新对象；将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象） ；执行构造函数中的代码（为这个新对象添加属性） ；返回新对象。问题2:不加new操作符直接执行构造函数会发生什呢...
Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。 只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目： # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新项目 $ vue init webpack my-project $ vue init webpack test //输入命令 ? Project name (test) test ? Project n...
gulp是前端开发过程中自动构建项目的工具，相同作用的还有grunt。构建工具依靠插件能够自动监测文件变化以及完成js/sass/less/html/image/css/coffee等文件的语法检查、合并、重命名、压缩、格式化、浏览器自动刷新、部署文件等功能。 所有的环境都是在 node 安装好的基础上执行的。 node -v 查看node的安装情况。npm -v查看npm 的安装情况. gulp自动化构建常用参数 1、src 读取文件或者文件夹 2、dest 生成文件也就是写文件 3、wa...
前言 node本身为单进程，并使用驱动模式处理并发，为了解决单进程在多核cpu上的资源浪费，node提供了cluster和child_process模块来创建多个子进程。Node.js是单线程的,对于现在普遍是多处理器的机器是一种浪费,怎么能利用起来呢？于是child_process模块出现了。child_process模块可以在其他进程上产生、派生，并执行工作。 child_process模块提供了一个ChildProcess的新类，它可以作为从父进程访问子进程的表示形式。Process模块也...
一、 ├── build // 项目构建(webpack)相关代码 记忆：（够贱） 9个 │ ├── build.js // 生产环境构建代码 │ ├── check-versions.js // 检查node&npm等版本 │ ├── dev-client.js // 热加载相关 │ ├── dev-server.js // 构建本地服务器 │ ├── utils.js // 构建配置公用工具 │ ├── vue-loader.conf.js // vue加载器 │ ├── webpack.base.conf.js // webpack基础环境配置 │ ├── webpack.dev.conf.js ...
什么是Three.js？ 如果你正在读这篇文章，你可能对Three.js有一定的了解，那我们来简单地介绍下Three.js是什么. Three.js是一个库，使得WebGL的3D效果在浏览器中运用很容易。而在原始的WebGL中一个简单的立方体会变成数百Javascript和着色器代码的行，而一个Three.js只需要一点点代码.本节目标是为 three.js 做简介。我们从使用旋转立方体来搭建场景开始。如果遇到困难需要帮助，页面底部有可参考的源码。 一个场景至少需要的三种...
前言前一段时间公司Vue.js项目需要使用UEditor富文本编辑器,在百度上搜索一圈没有发现详细的说明,决定自己尝试,忙活了一天终于搞定了。 具体可以参考这篇文章：//www.gxlcms.com/article/118413.htm ueditor是百度编辑器，官网地址：http://ueditor.baidu.com/website/ 完整的功能演示，可以参考：http://ueditor.baidu.com/website/onlinedemo.html 最近工作中要求升级，需要在vue中创建多个ueditor实例，我使用neditor，其实就是...
本文实例为大家分享了vue自定义过滤器创建和使用方法，供大家参考，具体内容如下过滤器：生活中有很多例子，净水器 空气净化器 。过滤器的作用：实现数据的筛选、过滤、格式化。 vue1.*版本是有内置的过滤器，但是在vue2.*所有的版本都已经没有自带的过滤器了。 1、过滤器创建过滤器的本质 是一个有参数 有返回值的方法 new Vue({filters:{myCurrency:function(myInput){return 处理后的数据}}}) 2、过滤器使用语法：<any>{{表达式...
对于某些项目来说，单页面不能很好的满足需求，所以需要将vue-cli创建的单页面项目改为多页面项目。 需要修改以下几个文件： 1、下载依赖glob $npm install glob --save-dev2、修改build下的文件 （1）修改webpack.base.conf.js 添加以下代码： var glob = require(glob)； var entries = getEntry(./src/pages/**/*.js)将module.exports中的 entry: {app: ./src/main.js},注释掉，然后添加这一行代码：entry: entries,至于entries...
插件描述：particles.js用于创建粒子的轻量级 JavaScript 库。 查看 效果 源码下载 使用 加载 particles.js和配置粒子 <div id="particles-js"></div> <script src="particles.js"></script>app.js /* particlesJS.load(@dom-id, @path-json, @callback (optional)); */ particlesJS.load(particles-js, assets/particles.json, function() {console.log(callback - particles.js config loaded); });particles....