JavaScript - 教程之家

73浏览

0评论

VUE2.0+ElementUI2.0表格el-table循环动态列渲染的写法详解

先看看ElementUI里关于el-table的template数据结构：<template> <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期...

2020-05-27

94浏览

0评论

VUE2.0+ElementUI2.0表格el-table实现表头扩展el-tooltip

ElementUI2.0的表格的扩展：elementUI表格table elementUI文字提示Tooltip如果要实现鼠标移到表头有注释或者弹框该怎么添加呢？<el-table empty-text="正在加载中..." :data=...

2020-05-27

89浏览

0评论

Element Table的row-class-name无效与动态高亮显示选中行背景色

Element UI 的Table组件踩坑记：
（1）参数row-class-name无效的坑：官方文档给出了如下代码：

但是我使用后并没有出现预初想要第一行高亮的效果，然后console.log(row, rowIndex)，...

2020-05-27

78浏览

0评论

webpack打包多页面的方法

前言一开始接触webpack是因为使用Vue的关系，因为Vue的脚手架就是使用webpack构建的。刚开始的时候觉得webpack就是为了打包单页面而生的，后来想想，这么好的打包方案，只在单页面...

2020-05-27

79浏览

0评论

js canvas实现写字动画效果

本文实例为大家分享了js canvas实现写字动画效果展示的具体代码，供大家参考，具体内容如下页面html：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>学...

2020-05-27

75浏览

0评论

微信小程序实现保存图片到相册功能

项目中有个保存二维码到相册的功能，所以涉及到用户是否授权相册权限的问题。废话不多说，直接上干货... 　　功能逻辑：　　　　先检查用户请求过的权限中是否允许"保存到相册"权...

2020-05-27

93浏览

0评论

vue 实现左右拖拽元素并且不超过他的父元素的宽度

话不多说，先上需求图需求：这是一个音频播放的组件，隐藏audio样式，用js调用脚本方法实现，目前功能基本实现，但是有个问题，图中共有一根绿色的begin线和红色的end线，使用这两根线切割...

2020-05-27

65浏览

0评论

微信小程序canvas.drawImage完全显示图片问题的解决

问题描述
问题产生
对于微信小程序，canvas处理过程中，dramImage默认图片引用是有残缺的导入初始项目
打开链接（原官网例子），浏览器唤醒微信开发这工具，打开连接之前需要下载好微信...

2020-05-27

65浏览

0评论

基于jquery实现九宫格拼图小游戏

九宫格拼图小游戏是小时候比较常见的小游戏之一。闲着无聊就用js简单写了一个。游戏的玩法很简单。九宫格中有八个小图片。随机打乱之后，将八张小图片拼接成一个完整的图。ht...

2020-05-27

76浏览

0评论

vue 双向数据绑定的实现学习之监听器的实现方法

提到了vue实现的基本实现原理：Object.defineProperty() -数据劫持和发布订阅者模式（观察者），下面讲的就是数据劫持在代码中的具体实现。1.先看如何调用new一个对象，传入我们的...

2020-05-27

83浏览

0评论

jQuery实现网页拼图游戏

之前看了一个页面中将图片分割的效果，感觉不错，有些好奇他是怎么实现的。
跟搭档说了一下，大概明白。其实就是利用 overflow=hidden ，margin-left, margin-top 这三个属性的配合...

2020-05-27

325浏览

0评论

Vue+Webpack完美整合富文本编辑器TinyMce的方法

选择一个合适的富文本编辑器对于一个前端项目至关重要，这次我基于Vue来开发我项目中的前端部分，经过权衡选择了tinymce。其在UI，功能都很适合，tinymce官方文档：点击打开链接；引入t...

2020-05-27

75浏览

0评论

JS实现图片拖拽交换效果

JS实现图片拖拽交换效果，供大家参考，具体内容如下
听 WEB前端javascript企业实战班公开课，用JS实现了图片拖拽交换的目的；感谢老师的讲解。实现要点
鼠标点击onmousedown：获取...

2020-05-27

74浏览

0评论

vue拖拽排序插件vuedraggable使用方法详解

大家好，最近做的项目要用到拖拽排序，我现在的项目是vue项目，所以我就屁颠屁颠的去百度有木有这样功能的插件，我就知道一定会有，那就是vuedraggable，这是一款很棒的拖拽插件，下面我...

2020-05-27

81浏览

0评论

基于Vue组件化的日期联动选择器功能的实现代码

我们的社区前端工程用的是element组件库，后台管理系统用的是iview，组件库都很棒，但是日期、时间选择器没有那种“ 年份 - 月份 -天数 ” 联动选择的组件。虽然两个组件库给出的...

2020-05-27

84浏览

0评论

一次Webpack配置文件的分离实战记录

前言随着前端技术的发展，业务逻辑的增多及功能化的繁琐已经成为前端人员最烧脑的问题。前端自动化构建工具的出现，为前端人员带来了项目构建上的福音，成为每个前端工程师必回的...

2020-05-27

65浏览

0评论

BootStrap table实现表格行拖拽效果

本文实例为大家分享了BootStrap table实现表格行拖拽的具体代码，供大家参考，具体内容如下不上图了
首先还是得添加三个文件，自己上网搜搜就行<script src="~/Content/bootstrap...

2020-05-27

58浏览

0评论

vuejs2.0运用原生js实现简单拖拽元素功能

本文实例为大家分享了vuejs2.0实现简单拖拽元素功能的具体代码，供大家参考，具体内容如下<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, in...

2020-05-27

86浏览

0评论

BootStrap modal实现拖拽功能

bootstrap中有javascript插件modal也就是对话框，加入拖拽功能，具体内容如下在使用modal时首选需要引用js<link href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.css"...

2020-05-27

73浏览

0评论

Vue组件Draggable实现拖拽功能

Draggable为基于Sortable.js的vue组件，用以实现拖拽功能。具体说明，请参考：学习链接npm官方演示：vuedraggable特性：支持触摸设备支持拖拽和选择文本支持智能滚动支持不同...

2020-05-27

70浏览

0评论

vuedraggable+element ui实现页面控件拖拽排序效果

项目要实现一些控件的拖拽排序。从而找到了这款vuedraggable控件，供大家参考，具体内容如下如上图要实现这些控件的拖拽排序
这是拖拽后由于公司网络的原因，项目没有使用npm，都是...

2020-05-27

95浏览

0评论

vue.draggable实现表格拖拽排序效果

本文实例为大家分享了vue.draggable实现表格拖拽排序效果展示的具体代码，供大家参考，具体内容如下主要使用vuedraggable和sortablejs两个组件。 1、安装组件npm install vuedr...

2020-05-27

68浏览

0评论

vue插件draggable实现拖拽移动图片顺序

本文实例为大家分享了vue插件draggable实现拖拽移动图片顺序的具体方法，供大家参考，具体内容如下
例如图片显示的这种图片列表、商品展示需要拖动图片改变顺序，vuedraggable可...

2020-05-27

82浏览

0评论

vue实现div拖拽互换位置

本文实例为大家分享了vue实现div拖拽互换位置的具体代码，供大家参考，具体内容如下template模板
<transition-group tag="div" class="container"> <div class="item" v-for="...

2020-05-27

105浏览

0评论

vue拖拽组件使用方法详解

前言pc端开发需要拖拽组件完成列表的顺序交换，一般移动端的UI组件会包含，但是我在用的iview并没有此功能的组件，于是手写一个，实现起来很简单。效果图如下：可以拖拽完成新排序，点...

2020-05-27

82浏览

0评论

vue实现移动端悬浮窗效果

本文讲述，在使用VUE的移动端实现类似于iPhone的悬浮窗的效果。相关知识点
touchstart 当在屏幕上按下手指时触发touchmove 当在屏幕上移动手指时触发touchend 当在屏幕上抬起...

2020-05-27

69浏览

0评论

jquery拖拽自动排序插件使用方法详解

本文为大家分享了jquery拖拽自动排序插件，供大家参考，具体内容如下
该插件并不是原生js写的，是基于jquery的，想看原生的话，请绕道而行。html:<!DOCTYPE html><html lang="en"><he...

2020-05-27

79浏览

0评论

jQuery-ui插件sortable实现自由拖动排序

本文为大家分享了jQuery ui插件sortable实现自由拖动排序的具体方法，供大家参考，具体内容如下此为网上资源demo自己做了修改，记录下方便日后的学习。效果展示：代码展示：<!doctype...

2020-05-27

81浏览

0评论

JavaScript实现简单轮播图效果

本文实例为大家分享了js实现简单轮播图效果的具体代码，可以实现左右翻转，图片切换显示等效果，供大家参考，具体内容如下效果展示：代码展示：<!doctype html> <html><!-- 学习功能：使...

2020-05-27

141浏览

0评论

GOJS+VUE实现流程图效果

前言及展示在项目中需要根据传过来的数据画出流程图，采用了GOJS插件，功能很全面，可以根据自己的需要调整，不过建议简单的流程图还是自己手写一个组件，更加便于维护和变换。有一点...

2020-05-27

61浏览

0评论

Angular6 Filter实现页面搜索的示例代码

前言
我们在开发过程中经常会遇到在页面上实现全局搜索的需求，例如：表格搜索，通过关键词检索整个表格，过滤出我们需要的数据。在Angular6 中我们可以通过Filter + Pipe 的方式来...

2020-05-27

107浏览

0评论

在移动端使用vue-router和keep-alive的方法示例

对于web开发和移动端开发，两者在路由上的处理是不同的。对于移动端来说，页面的路由是相当于栈的结构的。vue-router与keep-alive提供的路由体验与移动端是有一定差别的，因此常...

2020-05-27

76浏览

0评论

详解Vue一个案例引发「内容分发slot」的最全总结

今天我们继续来说说 Vue，目前一直在自学 Vue 然后也开始做一个项目实战，我一直认为在实战中去发现问题然后解决问题的学习方式是最好的，所以我在学习一些 Vue 的理论之后，就开始...

2020-05-27

84浏览

0评论

Vuejs监听vuex中值的变化的方法示例

比如说,例如,你有一篮子水果,每次你从篮子里添加或拿走水果 ,你想显示有关水果数量的信息,但是你也想当篮子中数量变化的时候收到通知。fruit-count-component.vue <templa...

2020-05-27

75浏览

0评论

mpvue 单文件页面配置详解

前言
mpvue 的出现把 vue 的开发体验带到了小程序这个平台中，但其目录结构与传统的 vue 项目却并不完全一致，一个典型的页面包含以下三个文件：index.vue // 页面文件main.js //...

2020-05-27

101浏览

0评论

小程序实现授权登陆的解决方案

前言
之前写过一个关于微信授权登陆的文章
传送门
最近在做小程序的项目，依旧是商城，又开始研究微信的登陆授权坑，第一次接触小程序，授权登陆也是一塌糊涂以后再慢慢的改进场景...

2020-05-27

63浏览

0评论

Vue.Draggable拖拽功能的配置使用方法

本文实例为大家分享了Vue.Draggable拖拽功能的具体代码，供大家参考，具体内容如下使用cmd命令在项目根目录下下载安装Vue.Draggablenpm install vuedraggable 在组件中需要使用...

2020-05-27

84浏览

0评论

VueJS 组件参数名命名与组件属性转化问题

HTML 特性是不区分大小写的。所以，当使用的不是字符串模版，camelCased (驼峰式) 命名的 prop 需要转换为相对应的 kebab-case (短横线隔开式) 命名：Vue.component('child', {//...

2020-05-27

84浏览

0评论

JS跨域请求的问题解析

同源策略在运行中我们有时会出错是因为我们违反了同源策略，这是一种浏览器所实施的安全措施，用于限制具有不同来源的文档之间的交互。页面的来源由其协议，主机和端口号定义。具...

2020-05-27

118浏览

0评论

浅谈ng-zorro使用心得

前言本周使用ng-zorro做了项目的原型，对它也有了一定的了解，总的来说不难，可以用强化版boostrap来理解它,由于黄庭祥初始化工作做得很好，在写的过程遇到的问题不是很麻烦，感谢祥...

2020-05-27

98浏览

0评论

Vue.js中 v-model 指令的修饰符详解

1 .lazyv-model 指令默认会在 input 事件中加载输入框中的数据（中文输入法中输入拼音的过程除外）。我们可以使用 .lazy 懒加载修饰符，让其只在 change 事件中再加载输入框中的...

2020-05-27

99浏览

0评论

如何使用 vue + d3 画一棵树

github pagesvue 和 d3 的角色画图可分为两步：元素坐标计算数据绑定坐标计算只需要一些 api，本文使用 d3。数据绑定既可以借助 d3，也可以使用 vue。d3 通过操作 dom 实现，有...

2020-05-27

156浏览

0评论

ng-zorro-antd 入门初体验

Angular版本的 Ant Design 总算发布了，其名曰：ng-zorro-antd。这人要是越期待，心就越着急。早在8月上旬我就开发好了 ng-zorro-vscode；一个在vscode下的snippets。因此，虽然那时...

2020-05-27

107浏览

0评论

Vue.js 中的 v-model 指令及绑定表单元素的方法

我们可以使用 Vue.js 中的 v-model 指令来完成表单数据的双向绑定。1 基础用法1.1 文本输入框（text）这里演示了在文本输入框上输入的内容，会实时映射到绑定的数据上。html：
<div...

2020-05-27

93浏览

0评论

react-router 路由切换动画的实现示例

路由切换动画
因为项目的需求，需要在路由切换的时候，加入一些比较 zb 的视觉效果，所以研究了一下。把这些学习的过程记录下来，以便以后回顾。同时也希望这些内容能够帮助一些跟...

2020-05-27

91浏览

0评论

koa2实现登录注册功能的示例代码

本文介绍了koa2实现登录注册功能的示例代码，分享给大家，具体如下:这个主要结合前几天的内容，做个实际案例的效果版本：项目结构：前几天，我们把注册和登录的页面demo实现了，今天我们...

2020-05-27

91浏览

0评论

JS基于Location实现访问Url、重定向及刷新页面的方法分析

本文实例讲述了JS基于Location实现访问Url、重定向及刷新页面的方法。分享给大家供大家参考，具体如下：js通过Location实现访问Url,重定向,刷新页web中经常会使用到刷新页面，访...

2020-05-27

69浏览

0评论

使用mpvue搭建一个初始小程序及项目配置方法

1. 初始化一个 mpvue 项目现代前端开发框架和环境都是需要 Node.js 的，如果没有的话，请先下载 nodejs 并安装。然后打开命令行工具：# 1. 先检查下 Node.js 是否安装成功$ node...

2020-05-27

89浏览

0评论

写gulp遇到的ES6问题详解

前言Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。最近复习一下gulp一些基本的写法，在写了一些简单的uglify,rename,concat,clean的处...

2020-05-27

86浏览

0评论

使用NestJS开发Node.js应用的方法

NestJS 最早在 2017.1 月立项，2017.5 发布第一个正式版本，它是一个基于 Express，使用 TypeScript 开发的后端框架。设计之初，主要用来解决开发 Node.js 应用时的架构问题，灵感来...

2020-05-27

热门文章