一、vue是什么 Vue 是一套用于构建用户界面的 渐进式框架 。 压缩后仅有17kb 二、vue环境搭建 你直接下载并用 <script> 标签引入, Vue 会被注册为一个全局变量。 但在用 Vue 构建大型应用时推荐使用 NPM 安装。 这里推荐一下是用淘宝的cnpm,非常的快 npm install -g cnpm --registry=https://registry.npm.taobao.org然后进行安装 # 全局安装 vue-clinpm install --g vue-cli # 创建一个基于 webpack 模板的新项目vue init webpa...
一、preload()函数与图片上传 preload()函数是一个特殊的函数,它同setup()类似,只在程序开始时运行一次,但顺序在setup()之前。 一般我们会将媒体文件(图片、声音)加载的语句放在preload()中,因为preload()有一个特性就是不加载完毕,程序就不会开始,保证了程序运行时不会出错。 在加载图片之前,我们需要先将图片文件上传。 方法是: ①点击编辑器左上角的小三角展开文件目录。②点击文件目录右上角小三角,展开菜单后Add F...
JavaScript 程序越来越复杂,调试工具的重要性日益凸显。客户端脚本有浏览器,Node 脚本怎么调试呢?2016年,Node 决定将 Chrome 浏览器的"开发者工具"作为官方的调试工具,使得 Node 脚本也可以使用图形界面调试,这大大方便了开发者。 本文介绍如何使用 Node 脚本的调试工具。 一、示例程序 为了方便讲解,下面是一个示例脚本。首先,新建一个工作目录,并进入该目录。 $ mkdir debug-demo $ cd debug-demo然后,生成 package.js...
一、跟随鼠标移动的小球 使用mouseX,mouseY可以创建一个跟随鼠标移动的小球。 function setup() { createCanvas(400, 400); } function draw() { background(220); ellipse(mouseX,mouseY,20,20); } 二、让小球更加平滑的移动——使用Easing一般制作精良的UI界面都会用到平滑移动这一效果,也就是利用了名为“Easing”的方法。 实现思路是另外设置变量以进行位置的过渡,代码如下: var x=0; var y=0; var targetX=0; var ta...
Vuex 是什么? 官方给出的解释:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 相信很多新选手看完这段话有种绝望的感觉。开始我也是这样的,后来我想到了一个比方! 比如某年级有5个小班,每个小班有25个同学,但是只有一个老师授课,假如5个小班就对应着5个组件,每个班的25个同学就相当于每个组件中的25条数据,这个老师...
vuex.js状态(数据)管理在vue中当我们管理数据的时候比较乱,我们要用到下面的这个库,vuex.js Vuex介绍 每一个Vuex应用的核心就是store(仓库),他是用来存储数据的 "store" 基本上就是一个容器,它包含着你的应用中大部分的状态(state)。Vuex 和单纯的全局对象有以下两点不同 1.Vuex 的状态存储是响应式的 2.你不能直接改变 store 中的状态 vuex有6个概念 Store(最基本的概念)(创库)State (数据)Getters(可以说是计算属性)Mu...
开场白 webGL可以让我们在canvas上实现3D效果。而three.js是一款webGL框架,由于其易用性被广泛应用。如果你要学习webGL,抛弃那些复杂的原生接口从这款框架入手是一个不错的选择。 博主目前也在学习three.js,发现相关资料非常稀少,甚至官方的api文档也非常粗糙,很多效果需要自己慢慢敲代码摸索。所以我写这个教程的目的一是自己总结,二是与大家分享。 本篇是系列教程的第一篇:入门篇。在这篇文章中,我将以一个简单的demo为例...
本文介绍了react.js使用webpack搭配环境的入门教程,分享给大家,也给自己做个笔记 如果你想直接上手开发,而跳过这些搭配环境的繁琐过程,推荐你使用官方的create-react-app命令 npm install -g create-react-app //安装create-react-app脚手架 npm为node.js的包管理工具,请确保你已经安装了node.js create-react-app my-app //使用create-react-app创建,my-app为项目名称 cd my-app/ //进入my-app目录 npm start //运行项目现在...
一.什么是 WebpackWebpack 是一个模块打包器。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。webpack模式图二.为什么使用webpack市面上已经存在的模块管理和打包工具并不适合大型的项目,尤其单页面 Web 应用程序。最紧迫的原因是如何在一个大规模的代码库中,维护各种模块资源的分割和存放,维护它们之间的依赖关系,并且无缝的将它们整合到一起生成适合浏览器端请求加载的静态资源。而w...
前言 当想用 nodejs 抓取一些网页 , 我第一反应想到的就是使用 http 模块 , 比如抓取百度首页: var http = require(http); var req = http.request(http://www.baidu.com/, function (res) {res.setEncoding(utf8);res.on(data, function (chunk) {//响应内容console.log(chunk)}); }); req.end(function () {// console.log(连接关闭); });但是 , 这仅限于简单地抓取 html , 有很大的局限性。假如你想要的内容不在 html 里 , 而是...
Node 开源模板的选择很多,但推荐像我这样的老人去用 EJS,有 Classic ASP/PHP/JSP 的经验用起 EJS 来的确可以很自然,也就是说,你能够在 <%...%> 块中安排 JavaScript 代码,利用最传统的方式 <%=输出变量%>(另外 <%-输出变量是不会对 & 等符号进行转义的)。安装 EJS 命令如下:npm install ejsJS 调用JS 调用的方法主要有两个: ejs.compile(str, options); // => Function ejs.render(str, options); // => str 实际上 EJS...
本文实例讲述了nodejs入门教程之连接数据库的方法。分享给大家供大家参考,具体如下: 参考文章链接: nodejs连接mysql 1.准备工作 在nodejs中没有mysql模块,但npm中提供了mysql,所以可以使用npm安装mysql 命令:npm install mysql, 会生成 node_modules 文件夹 ,如图执行后发现报了一个警告,说没有package.json 这个文件,只需要执行 npm init -f 的命令就会生成一个这个文件2.直接连接数据库 mysql.createConnection(Objec...
本文实例讲述了nodejs入门教程之express模块用法。分享给大家供大家参考,具体如下: /*** Created by Dason on 2017/3/28.*/ var express = require(express); var morgan = require(morgan);//打印日志的中间件 //创建express 的实例 var app = express(); /*** 中间件:* Connect: Node.js的中间件框架* 分层处理:每层实现一个功能* 使用 use方法:向use方法传入具体的中间件*/ //Express 提供了内置的中间件 express.static 来...
本文实例讲述了nodejs概念与用法。分享给大家供大家参考,具体如下: 一. nodejs 的特点 1.nodejs 是一个javaScript 的运行平台,采用了Google Chrome浏览器的V8引擎。 2.拥有事件驱动:当web server接收到请求,就把它关闭然后进行处理,然后去服务下一个web请求。当这个请求完成,它被放回处理队列,当到达队列开头,这个结果被返回给用户。 示例:点餐 在基于线程的方式中(thread-based way):收银员接待你点餐开始,收银员不能...
本文实例讲述了nodejs创建一个简单应用的方法。分享给大家供大家参考,具体如下: 1.创建 test.js // require 来载入 http 模块 var http = require(http); /*** 使用 http.createServer() 方法创建服务器,返回 一个对象* 对象有一个叫做 listen 的方法,并使用 listen 方法绑定 8000 端口。* 函数通过 request, response 参数来接收和响应数据。*/ http.createServer(function (request, response) {response.writeHead(200, {Con...