从源码里了解vue中的nextTick的使用

今天做了一个需求,场景是这样的:在页面拉取一个接口,这个接口返回一些数据,这些数据是这个页面的一个浮层组件要依赖的,然后我在接口一返回数据就展示了这个浮层组件,展示的同时,上...

js操作table中tr的顺序实现上移下移一行的效果

总体思路是在table外部加个div,修改div的innerHtml实现改变tr顺序的效果具体思路是获取当前要移动tr行的rowIndex,在table中删除掉,然后循环table的rows,到了目标行再直接加进去...

layer弹出子iframe层父子页面传值的实现方法

本文介绍了layer弹出子iframe层父子页面传值的实现方法,分享给大家,具体如下:
父页面获取子页面元素
格式:
$("#iframeID").contents().find("#eleID")示例代码:
father.html
<!D...

微信小程序功能之全屏滚动效果的实现代码

想做一个全屏滚动的效果,于是在网上找了一个差不多的例子,但是觉得有些地方不是很好,于是改进了一下;
先给大家展示下效果图,感觉不错,请参考实例代码。代码:wxml: <!-- 第一页 --...

详解vue中localStorage的使用方法

什么是localStorage对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:localStorage 和 sessionStorage1.sessionStorage(临时存储) :为...

详解Vue组件之作用域插槽

写作用域插槽之前,先介绍一下Vue中的slot内容分发:如果<child-component></child-component>标签之间没有插入那两个p标签的话,页面会显示子组件模板中定义的“<p>父组件如果没...

详解三种方式解决vue中v-html元素中标签样式

Vue为v-html中标签添加CSS样式<template> <div class="hello"> <section> <h2 class="title">{{news.title}}</h2> <p class="news-time">{{news.datetime}}</p> <div cl...

vue-cli3.0如何使用CDN区分开发、生产、预发布环境

前言:上一篇记录文vue-cli 3.0 build包太大导致首屏过长的解决方案中提到了CDN优化,之前是直接在html中手动注入JS,也没有对开发和生产模式进行区分,因为是使用收费的CDN,所以在...

微信上传视频文件提示(推荐)

晚上要下班了老板发来一个任务:把一个300M左右的视频压缩到100M以内,以便在微信上发送。这倒不是难事,狸窝咱又不是没用过,开搞!!!就是这么邪气,恰好100.18M视频质量:低等质量,音频质...

vue+node实现图片上传及预览的示例方法

本文介绍了vue+node实现图片上传及预览的示例方法,分享给大家,具体如下:先上效果图

上代码
html部分主要是借助了weui的样式<template> <div> <myheader :title="'发布动态'"...

js实现按钮开关单机下拉菜单效果

通过onclick单击事件,实现效果,代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>开关按钮设置</title> </head> <link rel="stylesheet" href=...

原生JS实现手动轮播图效果实例代码

手动轮播图,为轮播图中的一种,轮播图主要有无缝轮播,手动轮播,延迟轮播,切换轮播等等。。。轮播图主要用于展现图片,新出商品,词条,又能美观网页。給网页中增加动态效果。手动轮播,是...

浅析vue 函数配置项watch及函数 $watch 源码分享

Vue双向榜单的原理大家都知道Vue采用的是MVVM的设计模式,采用数据驱动实现双向绑定,不明白双向绑定原理的需要先补充双向绑定的知识,在watch的处理中将运用到Vue的双向榜单原...

vue中的ref和$refs的使用

ref:被用来给元素或子组件注册引用信息,引用信息将会注册在父组件的$refs对象上。如果在普通的DOM元素上使用,那么指向的就是普通的DOM元素。
ref 有三种用法:1、ref 加在普通的...

vue全局使用axios的方法实例详解

在vue项目开发中,我们使用axios进行ajax请求,很多人一开始使用axios的方式,会当成vue-resoure的使用方式来用,即在主入口文件引入import VueResource from 'vue-resource'之后,直...

vue-cli 2.*中导入公共less文件的方法步骤

在新版的Vue CLI 3中,如何导入公共less文件在文档里已经描述的很清楚了,但是在2.*的版本中,我没有查到相关的办法,网友的办法又相当复杂,于是我推荐给大家一个很简单的办法。首先...

Vue.js组件间通信方式总结【推荐】

平时在使用Vue框架的业务开发中,组件不仅仅要把模板的内容进行复用,更重要的是组件之间要进行通信。组件之间通信分为三种:父-子;子-父;跨级组件通信。下面,就组件间如何通信做一...

详解Angular中实现自定义组件的双向绑定的两种方法

在 Angular 中,对于表单元素,通过 [(ngModel)] 即可以简单地实现双向绑定。对于自定义组件而言,希望实现同样的效果可以怎么做呢?1 实现自定义组件的 ngModel 指令
如果希望自定...

angular4自定义表单控件[(ngModel)]的实现

[(ngModel)]拆分[(ngModel)] 将[]输入()输出组合起来,进行双向数据绑定。拆分开来 输入属性 [ngModel](ngModelChange)输出监听元素值的变化,并同步view value与model value...

详解Vue2.0组件的继承与扩展

前言本文将介绍vue2.0中的组件的继承与扩展,主要分享slot、mixins/extends和extend的用法。一、slot1.默认插槽和匿名插槽slot用来获取组件中的原内容,此方式用于父组件向子组...

vue使用better-scroll实现下拉刷新、上拉加载

本文目的是为了实现列表的下拉刷新、上拉加载,所以选择了better-scroll这个库。
用好这个库,需要理解下面说明 必须包含两个大的div,外层和内层div 外层div设置可视的大小(宽...

详解Angular模板引用变量及其作用域

Angular模板引用变量
如果你曾经参与过Angular项目的开发,那么你可能一眼就会看出谁将是本文的主角:<input type="text" [value]="value" #name>若你对此陌生,也无须在意。示例...

创建echart多个联动的示例代码

鼠标悬浮同时触发多个echart效果如下html代码<div class="contain"> <div class="sel"> <div class="sel1"> <div class="top"> <span>选择时间间...

详解小程序不同页面之间通讯的解决方案

小程序做开发的时候难免需要不同页面之间的通讯,比如首页打开新的页面搜索获取结果返回到首页,不同tab页面之间的数据交互等等。于是做了以下总结当前页面打开新的页面
打开新...

详解js静态检查工具eslint配置文件

ESLint 是一个 Javascript 静态检查工具,它可以帮你养成良好的编程习惯{ // 环境定义了预定义的全局变量。 "env": { //环境定义了预定义的全局变量。更多在官网查看...

详解Vue CLI 3.0脚手架如何mock数据

前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段。我们在开发...

Angular ui-roter 和AngularJS 通过 ocLazyLoad 实现动态(懒)加载模块和依赖

什么是ui-router  ui-router是AngularUI库最有用的组件之一(AngularUI库由AngularJS社区构建)。它是一个第三方路由框架,允许通过状态机制组织接口,而不是简单的URL路由。 什...

vue下拉菜单组件(含搜索)的实现代码

之前也写过这个小组件,最近遇到select下加搜索的功能,所以稍微完善一下。效果图:子组件 dropdown.vue<template> <div class="vue-dropdown default-theme"> <div class="cur-...

vue将单页面改造成多页面应用的方法

问题描述: 手头有一个项目是使用 vue-cli 搭建的单页面应用。项目分为了管理平台和用户查看页面,用户查看页面是很简单的页面,但是在加载过程中,却加载了整个应用的打包代码,量重...

详解离线安装npm包的几种方法

这段时间的工作主题就是Linux下的“离线部署”,包括mongo、mysql、postgresql、nodejs、nginx等软件的离线部署。平常在服务器上借助apt-get就能轻松搞定的事情,在离线环境下...

vue组件实践之可搜索下拉框功能

之前也写过这个小组件,最近遇到select下加搜索的功能,所以稍微完善一下。效果图:子组件 DROPDOWN.VUE<template> <div class="vue-dropdown default-theme"> <div class="cur-n...

electron + vue项目实现打印小票功能及实现代码

一 需求:公司项目需要通过electron调用系统打印机,实现打印小票的功能。二、分析:
electron打印大概有两种:第一种:通过window的webcontent对象,使用此种方式需要单独开出一个打印...

浅谈Vue.js 中的 v-on 事件指令的使用

v-on 事件指令用于绑定事件。1 基础用法v-on 指令绑定事件后,就会监听相应的事件。html:<div id="app"> <h3>已点击 {{count}} 次</h3> <button @click="count++">点我</butto...

vscode 开发Vue项目的方法步骤

下载地址: vscode https://marketplace.visualstudio.com/VSCode或者本地地址:https://www.freexyz.cn/softs/606746.html开始安装插件
Vetur : vue的文件代码高亮 Atom One...

Cookbook组件形式:优化 Vue 组件的运行时性能

Vue 2.0 在发布之初,就以其优秀的运行时性能著称,你可以通过这个第三方 benchmark 来对比其他框架的性能。Vue 使用了 Virtual DOM 来进行视图渲染,当数据变化时,Vue 会对比前后...

vue中tab选项卡的实现思路

今天分享下vue中tab选项卡的套路,废话不多说,直接上效果图应用场景&#8226;不同注册和登录方式切换
&#8226;操作选项切换 如保存和取消
&#8226;后台管理系统中各菜单选项切换...

vue中选项卡点击切换且能滑动切换功能的实现代码

具体代码如下所述: <div> <div class="navlist"> <ul> <li class="navli" v-for="(item,index) in navList" :class="{'activeT':nowIndex===index}" @click="tabClick...

移动端滑动切换组件封装 vue-swiper-router实例详解

具体代码如下所述:<strong>组件部分</strong><template> <div class="main"> <div class="page-tab"> <div :class="nowPath == item.path &#63; 'tab-item...

vue-router懒加载速度缓慢问题及解决方法

懒加载:也叫延迟加载,即在需要的时候进行加载,随用随载。
像vue这种单页面应用,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,时间...

Vue中的methods、watch、computed的区别

看到这个标题就知道这篇文章接下来要讲的内容,我们在使用vue的时候methods、watch、computed这三个特性一定经常使用,因为它们是非常的有用,但是没有彻底的理解它们的区别和各...

微信小程序页面间值传递的两种方法

一:url带参数传递 与前端语言一样,小程序页面间的传递可以通过在路由url后接参数,路由的同时会将参数一并传递到新的页面。index.wxml:<!--index.wxml--><view class=...

Vuex的初探与实战小结

1.背景最近在做一个单页面的管理后台项目,为了提高开发效率,使用了Vue框架来开发。为了使各个部分的功能,独立结构更加清晰,于是就拆分了很多组件,但是组件与组件之间数据共享成...

electron制作仿制qq聊天界面的示例代码

本文介绍了electron制作仿制qq聊天界面的示例代码,分享给大家,具体如下:效果图:
样式使用scss和flex布局这也是制作IM系统的最后一个界面了!
在制作之前参考了qq和千牛需要注意...

NodeJs 文件系统操作模块fs使用方法详解

NodeJs:文件读取API使用方法 - - readFile() 需求:使用Node中提供的文件操作API,读取files目录下的1.txt 文档中文本内容。 Node的三个组成部分:ECMAScript核心 + 全局成员 +...

Vue项目部署在Spring Boot出现页面空白问题的解决方案

网上流行的解决方案是将assetsPublicPath: '/'改成'./',下面说一下这个解决方案的弊端:通常页面空白的问题出现大多数是由于Spring Boot端配置了server.servlet.context-path,...

解决Vue开发中对话框被遮罩层挡住的问题

在Vue的开发中,一旦我们用到对话框,经常出现的问题是对话框被遮罩层挡住,无论是Element-UI dialog还是bootstrap的Modal,如下图所示:
造成这个问题的原因是对话框组件的父元素的p...

Vue.js的动态组件模板的实现

组件并不总是具有相同的结构。有时需要管理许多不同的状态。异步执行此操作会很有帮助。实例:组件模板某些网页中用于多个位置,例如通知,注释和附件。让我们来一起看一下评论,看...

详解Node.js 中使用 ECDSA 签名遇到的坑

最近有个朋友问我关于 Node.js 下使用 ECDSA 的问题,主要是使用 Node.js 的 Crypto 模块无法校验网络传输过来的签名结果。在踩坑无数后,终于搞清楚了原因。坑 0x00:签名输出格...

tracking.js页面人脸识别插件使用方法

tracking.js是页面识别人脸的一个插件,首先是tracking.js的git地址在下载完tracking.js后,我们需要一个能测试的页面,这个页面需要在服务器上,比如本地的localHost:8080。然后需...

trackingjs+websocket+百度人脸识别API实现人脸签到

在公司做了个年会的签到、抽奖系统。用java web做的,用公司的办公app扫二维码码即可签到,扫完码就在大屏幕上显示这个人的照片。之后领导让我改得高大上一点,用人脸识别来签到,...

返回顶部
顶部