vue.js自定义组件directives的实例代码

自定义指令:以v开头,如:v-mybind。代码示例:<input v-mybind />directives:{ mybind:{ bind:function (el) { el.value = "this is mybind-bind" } }}
这时页面初始...

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码

具体代码如下所示:// 1.scroll-y="true" Y轴滚动 // 2.应该是设置了高才能行// 3.使用scroll-top属性实现滚动到底部,scroll-top不要带单位<scroll-view scroll-y="true" sty...

微信小程序实现跑马灯效果

网上很多实现跑马灯的文章,但是很多发现都是不行的,之一就是文字宽度居然是通过字符数*文字size计算,明显是不准确的计算方式。我看了下,发现可以通过计算控件宽度来精确计算文...

vue axios请求频繁时取消上一次请求的方法

一、前言
在项目中经常有一些场景会连续发送多个请求,而异步会导致最后得到的结果不是我们想要的,并且对性能也有非常大的影响。例如一个搜索框,每输入一个字符都要发送一次请...

node+express框架中连接使用mysql(经验总结)

最近在学习node.js,做了一个练手项目,使用node.js+express框架,配合mysql数据库和前端vue框架开发一个多人文档编辑系统。node.js环境下express+mysql的服务端项目示例首先是环...

Vue项目报错:Uncaught SyntaxError: Unexpected token <

遇到问题:今天做一个 VUE 的项目,在引入第三方依赖的 JS 文件时,遇到了一个问题:控制台的提示:Uncaught SyntaxError: Unexpected token <
按照提示进入文件,再看如下图:仔细看了看...

如何在基于vue-cli的项目自定义打包环境

在工作当中,遇到了下面这个问题:测试环境与生产环境中的用户权限不一样,因此,就需要根据测试环境打一个包,生产环境又打一个包。
可是,如果每次打包都需要更改权限的配置文件的话,...

详解如何制作并发布一个vue的组件的npm包

前提:1.会vue基础,以及vue的组件(官网:https://cn.vuejs.org/v2/guide/components.html)相关的基础。因为本文主要是讲如何把一个vue组件做成npm包并发布。分为2大步骤:一.按照...

Vue组件之单向数据流的解决方法

子组件能够通过自身的props选项获取父组件上的数据,但是在默认情况下,props是单向绑定的---当父组件数据(属性)发生变化的时候会传递给子组件,引起子组件的变化,但不能反过来并且...

优雅的在React项目中使用Redux的方法

或许你当前的项目还没有到应用Redux的程度,但提前了解一下也没有坏处首先我们会用到哪些框架和工具呢?
React
UI框架
Redux
状态管理工具,与React没有任何关系,其他UI框架也可以...

详解vue-cli 3.0 build包太大导致首屏过长的解决方案

前言:最近用vue-cli 3.0 构建一个小型的工单管理系统,完工后build发现一个chunk-vendors包就达到985kb,加上其他一些资源文件,首页的下载总共大小快要2M。测试给的第一个反馈就...

AngularJS上传文件的示例代码

使用AngularJS上传文件 前台是Angular页面 后台使用SpringBoot/SpirngMVC上传文件
html
<div> <input id="fileUpload" type="file" /> <button ng-click="uploadFile()...

详解如何在vue项目中使用eslint+prettier格式化代码

对于前端代码风格这个问题一直是经久不衰,每个人都有自己的代码风格,每次看到别人代码一团糟时候我们都会吐槽下。今天给大家介绍如何使用eslint+prettier统一代码风格。对于...

详解Vue 动态组件与全局事件绑定总结

最近在自学 Vue 也了解了一些基本用法,也记录了一些笔记有兴趣的朋友可以去查看我的其他文章,技术这东西真的不能光靠看,看是没有的,你必须要动手实践,只有在实战项目中才能发现...

微信小程序车牌号码模拟键盘输入功能的实现代码

先来一波预览图。预览图片一:
预览图二:预览图三:
预览图四:
预览图五: 大概的效果就和原来图差不多。思路解析:车牌号码由31位汉字,26位字母,10位数字组成的,开头第一位由省份简称...

基于Vue实现图片在指定区域内移动的思路详解

当图片比要显示的区域大时,需要将多余的部分隐藏掉,我们可以通过绝对定位来实现,并通过动态修改图片的left值和top值从而实现图片的移动。具体实现效果如下图,如果我们移动的...

详解如何在Node.js的httpServer中接收前端发送的arraybuffer数据

最近使用了protobuf进行数据交互,发送在node.js接收前端的二进制数据出现了数据错误等问题。后来发现思路上面的问题,在req.on('data',()=>{})事件中的处理不适当才引发数据错...

vue组件从开发到发布的实现步骤

本文介绍了vue组件从开发到发布的实现步骤,分享给大家,具体如下:组件化是前端开发非常重要的一部分,从业务中解耦出来,可以提高项目的代码复用率。更重要的是我们还可以打包发布,...

webpack中如何使用雪碧图的示例代码

一、什么是雪碧图?
CSS雪碧 即CSS Sprite,也有人叫它CSS精灵,是一种CSS图像合并技术,该方法是将小图标和背景图像合并到一张图片上,然后利用css的背景定位来显示需要显示的图片部...

Vue项目引进ElementUI组件的方法

环境要求NodejsNodejs官网下载地址:http://nodejs.cn/download/具体安装参考其他资料打开cmd命令行,输入npm -v,如果出现如下图的显示,说明已经安装正确。如果安装版本比较老,想...

浅谈webpack+react多页面开发终极架构

webpack在单页面打包上应用广泛,以create-react-app为首的脚手架众多,单页面打包通常指的是将业务js,css打包到同一个html文件中,整个项目只有一个html文件入口,但也有许多业务...

跨域请求两种方法 jsonp和cors的实现

在网站后台跨域访问另一服务器时,若被访问服务器未设置response[‘Access-Control-Allow-Origin'] = ‘*' 那么将无法获取。jsonp方法
伪造ajax提交请求请求端 // 基于jsonp...

vue elementui form表单验证的实现

最近我们公司将前端框架由easyui 改为 vue+elementui 。自学vue两周 就开始了爬坑之路。业余时间给大家分享一下心得,技术新手加上第一次分享(小激动),有什么不足的地方欢迎大...

手动下载Chrome并解决puppeteer无法使用问题

因为网络原因,国内安装 puppeteer 的时候会报网络超时。这里使用 puppeteer-core 之后使用手动下载的 Chrome 进行操作。思路很简单,安装一个不带浏览器的 puppeteer ,再使用的...

用jQuery将JavaScript对象转换为querystring查询字符串的方法

在get方式的参数传递中,常常需要将JavaScript对象,转换成查询字符串,比如:{ method: 'get', state: '200' }会转换成&#63;method=get&state=200方法1:用JavaScriptserialize = fu...

微信运维交互机器人的示例代码

前言今年五月份参加Oracle开发者大会,在会议上看到智能AI在运维方面的应用场景;讲师现场展现了一款能够结合上下文对话的智能AI,通过聊天方式完成运维工作。会议后对该款智...

微信小程序左滑删除功能开发案例详解

直接进入正题,我们需要做的就是通过手指滑动列表项后,右侧出现删除;
比如说像这样:

向左边滑动后出现如下的效果:

开始撸代码~
假设我们有N个列表项来自一个数组list,先确定基本...

jQuery 操作 HTML 元素和属性的方法

jQuery拥有操作 HTML 元素和属性的强大方法。1. 获取HTML 元素的内容和属性  (1) 获得内容: text()、html() 以及 val()方法<!DOCTYPE html><html><head><meta http-equi...

详解如何解决vue开发请求数据跨域的问题(基于浏览器的配置解决)

在用vue做前端开发的时候,因为一般跑vue使用的webpack自带的node服务,而我们实际要使用的数据确是后台服务器上的,所以这就涉及到服务器请求跨域的问题。本来在诸如axios之类的...

React Hooks的深入理解与使用

你还在为该使用无状态组件(Function)还是有状态组件(Class)而烦恼吗?
——拥有了hooks,你再也不需要写Class了,你的所有组件都将是Function。
你还在为搞不清使用哪个生命周期钩子...

基于游标的分页接口实现代码示例

前言分页接口的实现,在偏业务的服务端开发中应该很常见,PC时代的各种表格,移动时代的各种feed流、timeline。出于对流量的控制,或者用户的体验,大批量的数据都不会直接返回给客户...

React手稿之 React-Saga的详解

Redux-Saga
redux-saga 是一个用于管理应用程序副作用(例如异步获取数据,访问浏览器缓存等)的javascript库,它的目标是让副作用管理更容易,执行更高效,测试更简单,处理故障更容易。...

vuex的module模块用法示例

想尝试使用vuex的module来进行操作,看了一些资料,我简单进行了一个简化目录结构:store│ index.js│ ├─feeds│ actions.js│ getters.js│ index.js│ mutation-typ...

vue中slot(插槽)的介绍与使用

什么是插槽?插槽(Slot)是Vue提出来的一个概念,正如名字一样,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性。插槽显不显示、怎...

Vue实现移动端页面切换效果【推荐】

在子页面把整个页面做绝对定位,覆盖整个屏幕,子父页面将 router-view 用 transition 套起来,并加上过渡动画就可以啦。代码:<!DOCTYPE html><html lang="en"><head> <meta char...

Vue实现一个无限加载列表功能

一个需要判断的地方就是加载中再次触发滚动的时候,不要获取数据。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>列表无限加载</title> <style> *...

详解Vue组件插槽的使用以及调用组件内的方法

组件传参
通过给组件传递参数, 可以让组件变得更加可扩展, 组件内使用props接收参数export default { props: ['options'], data(){ return {} }}但是这个方法有局限性, 例...

详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南

正如Vue官方所说,SSR配置适合已经熟悉 Vue, webpack 和 Node.js 开发的开发者阅读。请先移步ssr.vuejs.org 了解手工进行SSR配置的基本内容。从头搭建一个服务端渲染的应用是...

详解从NodeJS搭建中间层再谈前后端分离

之前在知道创宇的项目中有用到过nodejs作中间层,当时还不太理解其背后真正的原因;后来在和一位学长交谈的过程中,也了解到蚂蚁金服也在使用类似的方法,使用nodejs作为中间层去请...

node.js爬取中关村的在线电瓶车信息

背景
学习nodejs已经有段时间,网上很多nodejs爬虫的文章,所以着手练习写一段,最近打算买一辆电瓶车来上下班,但又不知道哪个好,网上是各说纷纭啊,于是就想着,干脆用node.js自己写一...

详解Vue实战指南之依赖注入(provide/inject)

案例
UI美眉说咱家的选项菜单太丑了,小哥哥能不能美化一下呀,洒家自然是说小意思啦~
自定义一个select组件,so easy~简单粗暴型:<el-select v-model="favourite" :option="[]"><...

webpack 从指定入口文件中提取公共文件的方法

在不明白CommonsChunkPlugin的使用情况下,直接上手webpack4的splitChunks,实在是难上加难。为了能更好的理解splitChunks的使用,必须出个题目,练练手,才能从中有所收获(下面的题目...

vue-router的使用方法及含参数的配置方法

htmlrouter-link:跳转链接参数to:就是跳转到的链接位置二层链接 eg:<router-link to="/users/evan">/users/evan</router-link>需要配置所对应的对应的children
children所对应...

vue-router传递参数的几种方式实例详解

vue-router传递参数分为两大类 编程式的导航 router.push 声明式的导航 <router-link>编程式的导航 router.push编程式导航传递参数有两种类型:字符串、对象。字符串字符串...

koa源码中promise的解读

koa 是一个非常轻量优雅的 node 应用开发框架,趁着双十一值班的空当阅读了下其源代码,其中一些比较有意思的地方整理成文与大家分享一下。洋葱型中间件机制的实现原理我们经常...

详解koa2学习中使用 async 、await、promise解决异步的问题

关键词:async 、await、promise
这三个东西 可以优雅的解决异步问题。在学习koa2的时候遇到了获取数据后再进行模板渲染的异步问题。在查找各种资料后成功的解决了该问题,现在...

详解如何用typescript开发koa2的二三事

前言最近在写一个博客的项目,前端用的 vue+typescript+element-ui ,后台则选择了 koa2+typescript+mongoDB 的组合。写这篇博客的目的也是在写后台的过程遇到一些问题,查了很...

JS中使用cavas截图网页并解决跨域及模糊问题

前几天给了个需求对浏览器网页进行截图,把网页统计数据图形表等截图保存至用户本地。首先对于网页截图,我用的是canvas实现,获取你需要截图的模块的div,从而使用canvas对你需要...

React父子组件间的传值的方法

父组件向子组件传值:
父组件:import React, { Component } from 'react';import Child from './chlid';class parent extends Component{ constructor(props) { super(props)...

checkbox在vue中的用法小结

前言关于checkbox多选框是再常见不过的了,几乎很多地方都会用到,这两天在使用vue框架时需要用到checkbox多选功能,实在着实让我头疼,vue和原生checkbox用法不太一样,之前对于vue...

返回顶部
顶部