vue-cli常用设置总结
基于vue-cli做了好几个项目了，想把一些自己的常用设置写出来，磨了好久，一看vue-cli3.0都快出来了，不能再磨了。。路径相关css内引用的资源build -> utils.js // generate loader...
2020-05-27
vue cli webpack中使用sass的方法
1：安装依赖npm install sass-loader node-sass --save-dev2：html中 修改style<style lang="sass"> /* write sass here */</style>3: 使用正常sass 语法//但是会报错<style la...
2020-05-27
jQuery实现碰到边缘反弹的动画效果
先上效果图：录出来有点卡顿的赶脚，实际上还是挺顺畅的。1.HTML:<div class="box"></div>2.CSS:body{ background:skyblue }.box{ position: absolute; top: 10px; left:...
2020-05-27
vue将对象新增的属性添加到检测序列的方法
vue中将对象中新增的属性增加到检测序列中deepCopy(o1, o2) { // 将o2的内容拷贝给data中的o1 var key, i if (o2 instanceof Array) { for (i = 0; i < o2.length;...
2020-05-27
解决Vue不能检测数组或对象变动的问题
来看一个实例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>vue</title> <script src="https://unpkg.com/vue@2.3.3/dist/vue.js"></script> <sty...
2020-05-27
vue watch监听对象及对应值的变化详解
如下所示：var vm=new Vue({ data:{ a:1, b:{ c:1 } }, watch:{ a(val, oldVal){//普通的watch监听 console.log("a: "+val, oldVal); }, b:{...
2020-05-27
使用watch监听路由变化和watch监听对象的实例
一、watch监听路由变化解决办法：export default{data(){return{}},watch:{"$route":"getPath" // 监听事件},methods:{getPath(){let path = this.$roune.path; //或得当前路...
2020-05-27
浅谈VUE监听窗口变化事件的问题
Vuejs 本身就是一个 MVVM 的框架。但是在监听 window 上的 事件 时，往往会显得 力不从心。比如 这次是 window.resize恩，我做之前也是百度了一下。看到大家伙都为这个问题而发...
2020-05-27
JS抛物线动画实例制作
在做无人便利小程序的项目中，某一天产品说要像某产商产品学习，给添加购物车增加抛物线小球动画。好吧，产品你最大，做！先给大家看下效果图分析
这种不固定起始位置的动画，自然不能...
2020-05-27
解决VUE框架 导致绑定事件的阻止冒泡失效问题
前面遇到了一个问题就是VUE框架内部做了一些处理，使得在我们通过v-for渲染DOM的时候添加新元素的时候，绑定事件也能对新增的元素有效。而这次遇到的问题则是，原本绑定事件中（该...
2020-05-27
JavaScript中利用Array filter() 方法压缩稀疏数组
什么是稀疏数组 数组元素的索引不一定要连续的，它们之间可以有空缺。每个javaScript数组都有一个length属性。针对非稀疏数组，该属性就是数组元素的个数；针对稀疏数组，length...
2020-05-27
Es6 Generator函数详细解析
ECMAScript 6 （简称 ES6 ）作为下一代 JavaScript 语言，将 JavaScript 异步编程带入了一个全新的阶段。Generator函数跟普通函数的写法有非常大的区别：一是，function关键字与函数...
2020-05-27
node.js基础知识小结
javascript之前一般用于web前段开发，然而由于node.js的出现，用javascript开发后端程序也不再是一件复杂的事情。node.js中js引擎来自于chrome v8浏览器，配合node.js额外开发的...
2020-05-27
详解Node 定时器
JavaScript 是单线程运行，异步操作特别重要。只要用到引擎之外的功能，就需要跟外部交互，从而形成异步操作。由于异步操作实在太多，JavaScript 不得不提供很多异步语法。这就好比...
2020-05-27
浅谈ajax请求不同页面的微信JSSDK问题
问题场景：我在A页面有一个表单内容需要使用蓝牙打印机打印，填完表单信息，并通过ajax请求发送到 B文件（PHP）中处理信息，正常通过form表单跳转到B页面后，是可以打印出来的，因为B页面中...
2020-05-27
Vue.js 2.0和Cordova开发webApp环境搭建方法
HTML5开发APP技术文档一、环境参数1、技术语言：HTML、CSS、ES6、Node.js等；2、框架：Vue.js 2.x、Cordova；3、开发系统：mac、windows等；4、环境配置： node 6+ npm 3+ （最好下载Node.j...
2020-05-27
vue实现模态框的通用写法推荐
在看了element组件的源码后发现，所有模态框其实实现方法都差不多，主要用到了vue在组件化上的双向绑定。代码：<!--查看槽点对话框--><template lang="html"> <transition name="...
2020-05-27
基于 D3.js 绘制动态进度条的实例详解
D3 是什么
D3 的全称是（Data-Driven Documents），顾名思义可以知道是一个被数据驱动的文档。听名字有点抽象，说简单一点，其实就是一个 JavaScript 的函数库，使用它主要是用来做数据...
2020-05-27
vue中简单弹框dialog的实现方法
效果如下，dialog中内容自行添加<template> <div> <div class="dialog-wrap"> <div class="dialog-cover" v-if="isShow" @click="closeMyself"></div> <transition name="d...
2020-05-27
element ui 对话框el-dialog关闭事件详解
通常会有需求，在关闭弹框后需要清空填写的数据，这时候就需要关闭事件了<el-dialog title="标题" :visible.sync="bind" size="small" @close='closeDialog'></el-dialog>在标...
2020-05-27
Vue 中的compile操作方法
在 Vue 里，模板编译也是非常重要的一部分，里面也非常复杂，这次探究不会深入探究每一个细节，而是走一个全景概要，来吧，大家和我一起去一探究竟。初体验我们看了 Vue 的初始化函数就...
2020-05-27
element ui里dialog关闭后清除验证条件方法
关闭dialog触发事件//vue <!--添加用户dialog begin--> <el-dialog title="编辑用户" :visible.sync="dialogFormVisible" custom-class="editDialog" :close-on-...
2020-05-27
element-ui 表格实现单元格可编辑的示例
如下所示：<template> <el-table :data="tableData" border @cell-mouse-enter="handleMouseEnter" @cell-mouse-leave="handleMouseOut" style="width: 100%"> <el-table-col...
2020-05-27
使用ngrok+express解决本地环境中微信接口调试问题
在微信项目的开发的时候，经常需要对微信jssdk提供的接口进行调试，比如说录音, 分享 ,上传图像等接口，但是微信jssdk要求绑定安全域名才能使用其提供的一系列功能 , 而在开发环...
2020-05-27
使用vue-cli编写vue插件的方法
利用vue组件创建模板，使用webpack打包生成插件再全局使用1、vue init webpack-simple 生成项目目录2、调整目录结构3、修改webpack.config.jsvar path = require('path')var...
2020-05-27
vue-cli下的vuex的简单Demo图解(实现加1减1操作)
1.vue-cli搭建好项目之后，使用npm安装vuex npm install vuex --save2.在项目目录中构建vuex目录（这里我新建了store的文件夹，里面新建了store.js文件）
3.在vue项目中的入口文件m...
2020-05-27
Bootstrap4如何定制自己的颜色和风格
Bootstrap是现在最流行的CSS框架，有许多网站、后台管理系统的样式都是基于Bootstrap设计的。然而，Bootstrap 始终保持着那蓝色 + 浅灰色彩基调，最新的 Bootstrap4 也是如此，看久...
2020-05-27
详解Angular系列之变化检测(Change Detection)
概述
简单来说变化检测就是Angular用来检测视图与模型之间绑定的值是否发生了改变，当检测到模型中绑定的值发生改变时，则同步到视图上，反之，当检测到视图上绑定的值发生改变时，则...
2020-05-27
vue bus全局事件中心简单Demo详解
1.vue-cli搭建好项目之后，使用npm安装vue-bus npm install vue-bus2.在入口文件main.js中全局注册 import Vue from 'vue'; import VueBus from 'vue-bus'; Vue.use(VueBus);...
2020-05-27
angular组件继承的实现方法第1/2页
Angular 2.3 版本中引入了组件继承的功能，该功能非常强大，能够大大增加我们组件的可复用性。
组件继承涉及以下的内容：
Metadata：如 @Input()、@Output()、@ContentChild/Childr...
2020-05-27
vue cli构建的项目中请求代理与项目打包问题
在上篇文章给大家介绍了vue-cli webpack模板项目搭建及打包时路径问题的解决方法，可以点击查看。vue-cli构建的项目中，生产模式下的打包路径、与生产模式下的请求代理简单示意...
2020-05-27
Angular4 ElementRef的应用
Angular 的口号是 - "一套框架，多种平台。同时适用手机与桌面 (One framework.Mobile & desktop.)"，即 Angular 是支持开发跨平台的应用，比如：Web 应用、移动 Web 应用、原生移...
2020-05-27
vue的全局提示框组件实例代码
这篇文章给大家介绍一个vue全局提示框组件，具体代码如下所示：<template> <!-- 全局提示框 --> <div v-show="visible" class="dialog-tips dialog-center"> <div>{{me...
2020-05-27
vue使用$emit时,父组件无法监听到子组件的事件实例
vue使用$emit时，父组件无法监听到子组件的事件的原因是$emit传入的事件名称只能使用小写，不能使用大写的驼峰规则命名<div id="counter-event-example"> <p>{{ total }}</p>...
2020-05-27
vue2 前端搜索实现示例
项目数据少的时候，搜索这样的小事情就要交给咱们前端来做了，重要声明，适用于小项目！！！！！其实原理很简单，小demo是做搜索市区名称或者按照排名搜索。<div> <input type="text" v-mod...
2020-05-27
vue 子组件向父组件传值方法
子组件注册触发事件，父组件注册 触发子组件事件后的方法写在method里面父组件这么写<component-a v-on:child-say="listenToMyBoy"></component-a><p>Do you like me? {{...
2020-05-27
angular2中使用第三方js库的实例
本文以jquery 为例第一种：有对应的声明文件的1、用命令安装jQuery的声明文件。（声明文件是为了ide完美智能提示）npm install -D @types/jquery2、引入jqueryimport * as $ from...
2020-05-27
Angular5中调用第三方js插件的方法
话不多说直入主题，最常见的有三种方式来引用第三方插件，下面以jquery插件及基于JQuery的两款插件：nicescroll和rangeSlider为例。一、第一种方式：在.angular-cli.json文件中配置...
2020-05-27
解决Angular.js中使用Swiper插件不能滑动的问题
我们都知道swiper是交互体验十分好的轮播插件但是通过angular（ng-repeat）循环出来的swiper不能轮播的解决方案通常我们都是通过以下方法来执行：html<div class="swiper-contain...
2020-05-27
swiper 解决动态加载数据滑动失效的问题
两种解决方法1、数据加载后进行swiper初始化success:function(result){var resultdata =eval("("+result+")");if(resultdata.status == 1){ var dataList = resultdata.dat...
2020-05-27
vue中echarts3.0自适应的方法
前端时间做一个vue的项目，echart是按需引入的如下：// 引入 ECharts 主模块import echarts from 'echarts/lib/echarts'// 引入折线图import 'echarts/lib/chart/line'// 引入...
2020-05-27
关于ES6箭头函数中的this问题
简要介绍：箭头函数中的this，指向与一般function定义的函数不同，箭头函数this的定义：箭头函数中的this是在定义函数的时候绑定，而不是在执行函数的时候绑定。（1）一般函数this指向在...
2020-05-27
jQuery幻灯片插件owlcarousel参数说明中文文档
Owl Carousel 是一个强大、实用但小巧的 jQuery 幻灯片插件，它具有一下特点： 兼容所有浏览器 支持响应式 支持 CSS3 过度 支持触摸事件 支持 JSON 及自定义 JSON 格式...
2020-05-27
vue2.5.2使用http请求获取静态json数据的实例代码
1.配置 build/webpack.dev.conf.js// 获取静态json数据const express = require('express')const app = express()const apiServer = express()const bodyParser = require(...
2020-05-27
Vue2.5通过json文件读取数据的方法
1.准备工作1.1 webpack.dev.conf.js在 const portfinder = require(‘portfinder') 的下面加上以下代码const express = require('express')const app = express()var appDa...
2020-05-27
详解react-native WebView 返回处理(非回调方法可解决)
1.前言项目中有些页面内容是变更比较频繁的，这些页面我们会考虑用 网页 来解决。在RN项目中提供一个公用的Web页，如果是网页内容，就跳转到这个界面展示。此时会有一个问题是，网...
2020-05-27
详解Vue Elememt-UI构建管理后台
安装
我使用的是 vue-cli 初始化项目，命令如下：npm i -g vue-climkdir my-project && cd my-projectvue init webpack修改 package.json 文件：..."dependencies": { "vue": "^2...
2020-05-27
详解jQuery中的isPlainObject()使用方法
说明
jQuery中的isPlainObject() 函数用于判断指定参数是否是一个纯粹的对象，返回值为Boolean类型。"纯粹的对象"，就是通过 { }、new Object()、Object.create(null) 创建的对...
2020-05-27
总结js函数相关知识点
要知道，在js中，引用类型是一种数据结构，包含5种引用类型，分别是Object,data,Array,re请输入代码gExp,Function。今天我们就说Function这种数据结构。
在js种函数实际上是对象，每...
2020-05-27
JS严格模式知识点总结
所谓严格模式其实就是一个不会赋值给任何变量的字符串 “use strict”
如果在全局作用域下 给出这个提示，那整个脚本将采用严格模式。也可以只在函数中打开严格模式1.严格模...
2020-05-27
