前言 上一篇博文我们讲到了节流函数的应用场景，我们知道了节流函数可以用在模糊查询、scroller、onresize等场景；今天这篇我们来讲防抖函数的应用场景：： 通过上一篇博文的学习，我们知道了防抖函数的原理：只有在事件触发的时候才会延迟加载，如果在延迟加载之前再次触发，则会刷新延迟时间重新延迟，触发次数有且只有触发一次； 如果对防抖函数原理有疑惑，请点击链接跳转到关于防抖函数讲解的博文：https://www.gxlcms.com/ar...
1.map组件的高度如果想要铺满屏幕，要是使用height:100vh样式 2.获取位置要在app.json中标明权限 3.先使用wx.getLocation获取自己的位置，然后再回调中使用setData方法，赋予数据给前台页面展示标注点 index.js //index.js //获取应用实例 const app = getApp() Page({data: {},onLoad: function () {var self=this;this.mapCtx = wx.createMapContext(myMap);wx.getLocation({type: gcj02,success(res) {self.setData({latitude :...
首先新建vue工程，一般我们不会特殊处理路由，但当项目页面越来越多，路由配置也会越来越大，路由文件就会变得不好维护 import Vue from vue import Router from vue-router import HelloWorld from @/components/HelloWorld import Home from @/components/Home import Test1 from ./test1.router.js import Test2 from @/components/children/Test2 import Test3 from @/components/children/Test3Vue.use(Router)export default...
1、递归组件-简单树形控件预览及问题 在编写树形组件时遇到的问题：组件如何才能递归调用？递归组件点击事件如何传递？2、树形控件基本结构及样式<template><ul class="vue-tree"><li class="tree-item"><div class="tree-content"><!--节点内容--><div class="expand-arrow"></div><!--展开或收缩节点按钮--><div class="tree-label">小学</div><!--节点文本内容--></div><ul class="sub-tree"><!--子节点--><li class="tree-ite...
将时间转换为毫秒数的方法有四个: Date.parse()Date.UTCvalueOf()getTime()1. Date.parse()：该方法接受一个表示日期的字符串参数，然后尝试根据这个日期返回日期的毫秒数。ECMA-262没有定义该方法支持哪种日期格式，因此这个方法的行为因为浏览器实现而异。如果传入字符串不能表示日期，那么它会返回NaN。该方法返回的毫秒值后三位全为0，精确到秒数，没有毫秒数。Date.parse("2012年9月9日") NaNDate.parse("2012 9 9") 13471200...
node实现简单的增删改查接口的全部代码如下： // 数据存储在users.json文件中 const express = require("express"); const fs = require("fs"); const cors = require("cors"); const bodyParser = require("body-parser"); const app = express();app.use(cors({ origin: "*" })); // fix 跨域 app.use(bodyParser.json()); // for parsing application/json app.use(bodyParser.urlencoded({ extended: true })); // for parsing...
前言vue开发手机端悬浮按钮实现，可以拖拽，滚动的时候收到里边，不影响视线 github地址 使用，基于vue-cli3.0+webpack 4+vant ui + sass+ rem适配方案+axios封装，构建手机端模板脚手架 vue-h5-template 后续将发布各种商城组件组件，让商城简单高效开发 线上体验 使用将 src/components文件夹下的s-icons组件放到你的组件目录下 使用组件 // template <template><div> <float-icons padding="10 10 60 10" class="icons-warp"...
直接通过element-ui自带的上传组件结合js即可，代码如下： HTML： <el-upload class="upload-demo" :action="actionUrl" :show-file-list="false" :on-success="handleAvatarSuccess":before-upload="beforeAvatarUpload"><button class="ce-button not-hover primary"><i class="ce-icon_upload"></i><span>重新上传</span></button></el-upload> js：beforeAvatarUpload(file) {var fileName = file.name || var ext = file...
微信小程序中button去除默认的边框的实现方法如下所示： button {position:relative;display:block;margin-left:auto;margin-right:auto;padding-left:14px;padding-right:14px;box-sizing:border-box;font-size:18px;text-align:center;text-decoration:none;line-height:2.55555556;border-radius:5px;-webkit-tap-highlight-color:transparent;overflow:hidden;color:#000000;background-color:#F8F8F8; }这是button默认自带的c...
JS1K是JavaScript编程竞赛——参加竞赛的规则很简单，脚本必须小于1K，竞赛网站开始也只是为了娱乐，却意外地收到了很多优秀的作品。 这是2016年JS1k上传的作品，用几十行代码实现的一个3D旋转魔方：代码如下： function z(t, e) {return t? e? t.appendChild(e) : "width:"+t+"px;height:"+t+" px;position:absolute;" : document.createElement("div") }function w() {++t==360&&(t=0, x=++x%3)for (i in m) 2 == m[i][s[x]] ? m...
说一种没人发的，利用混入mixins来实现全局变量和函数。mixins里面的方法、变量、筛选器会和组件里面的方法、变量、筛选器合并。这种方法优点是ide会有方法、变量、筛选器提示。 一、main.js文件 import Vue from vue import App from ./App import router from ./router import store from ./store import mixin from ./utils/mixin Vue.prototype.$bus = new Vue() //进行全局混入 Vue.mixin(mixin) new Vue({store,router,...
本篇我们将构建商品控件与购物车联动。 商品控件 商品控件的结构编写 在商品组件的<template>标签内完成项目结构，以及数据，事件的绑定，与判断逻辑的书写。 <template><div class="goods"><div class="menu-wrapper" ref="menuScroll"><ul><!--专场--><li class="menu-item" :class="{current:currentIndex===0}" @click="selectMenu(0)"><p class="text"><img :src="container.tag_icon" v-if="container.tag_icon" class="ic...
效果展示：密码隐藏：密码显示：代码展示： 一：<el-input>标签代码<el-form-item label="密码" prop="password"><el-input :type="passw" v-model="adduser.password" style="width: 300px;" ><%-- input中加图标必须要有slot="suffix"属性，不然无法显示图标 --%><i slot="suffix" :class="icon" @click="showPass"></i></el-input></el-form-item> 二：<script type="text/javascript">中代码 <script type="text/javas...
vue+django实现一对一聊天和消息推送的功能。主要是通过websocket，由于Django不支持websocket，所以我使用了django-channels。考虑到存储量的问题，我并没有把聊天信息存入数据库，服务端的作用相当于一个中转站。我只讲述实现功能的结构性代码，具体的实现还请大家看源代码。 前端聊天界面前端消息提醒界面后端代码 效果展示实现过程 后端 首先，我们需要先定义websocket的两条连接路径。ws/chat/xxx/（xxx指代聊天组）这条路径是...
Vue 使用计时器实现跑马灯效果，代码如下所示： <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><script src="../Vue/vue.js"></script><link href="lib/bootstrap-3.3.7/css/bootstrap.css" rel="external nofollow" rel="stylesheet"><title>跑马灯</title><style type="text/css...