Amanda_wmy的博客

Axios发送请求时params和data的区别在使用axios时，配置选项中包含params和data两者区别：因为params是添加到url的请求字符串中的，用于get请求。而data是添加到请求体（body）中的， 用于post请求。eg: get请求axios({method: "get",url: "http://www.tuling123.com/openapi/api...

vue-cli中的check-versions.js配置文件包括semver，chalk，shell插件的解释本文件是用来检测node和npm版本的// 下面的插件是chalk插件，他的作用是在控制台中输出不同的颜色的字，大致这样用chalk.blue('Hello world')，这款插件只能改变命令行中的字体颜色var chalk = require('chalk')// 下面这个...

vue-cli脚手架build目录中的webpack.dev.conf.js配置文件此配置文件是vue开发环境的wepack相关配置文件// 引入当前目录中的utils工具配置文件var utils = require('./utils')// 引入webpack来使用webpack内置插件var webpack = require('webpack')// 引入config目录中...

vue-cli脚手架build目录中的build.js配置文件这个配置文件是命令npm run build的入口配置文件，主要用于生产环境.下面是对其解释// 此文件是在node环境中运行的，使用webpack的nodejsAPI实现自定义构建和开发流程的// ---------------------// npm和node版本检查，请看我的check-versions配置文件解释文...

移动组件库cube-ui之后编译背景： 使用webpack+babel开发应用越来越多，而且一般都是通过NPM进行包管理的，这样依赖包越来越多，这些依赖包也是使用ES6+开发的，所以每个包都需要编译才能发布，这样编译后代码中往往包含很多编译代码，为了消除这部分冗余，推荐大家使用后编译。后编译解决的问题主要是代码冗余目前大部分的前端项目开发都是使用es6+的代码并且使用babel进行编译，而...

在vue-cli中引入lodash.js并使用lodash是一套工具库，它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数。中文文档： https://www.lodashjs.com/docs/4.17.5.htmllodash的所有函数都不会在原有的数据上进行操作，而是复制出一个新的数据而不改变原有数据模块的组成：Lodash 提供的辅助函数主要分为以下几类：Arra...

vue路由的钩子函数vue-router 提供的导航钩子主要用来拦截导航，让它完成跳转或取消。路由钩子分为三类： 全局的、单个路由独享的、或者组件级的全局钩子： 主要包括beforeEach和aftrEach,这类钩子主要作用于全局,一般用来判断权限,以及以及页面丢失时候需要执行的操作。一般写在main.js里面beforeEach函数有三个参数：- to:router即将进入的...

vue中TinyMCE编辑器的使用TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器。富文本编辑器UEditor：百度前端的开源项目，功能强大，基于 jQuery，但已经没有再维护，而且限定了后端代码，修改起来比较费劲bootstrap-wysiwyg：微型，易用，小而美，只是 Bootstrap + jQuery…所以项目中用到的是TinyMCE，可前后端分离。可购买 tiny...

Vue-cli项目中路由的基础用法文件目录编辑router文件夹下的index.js文件第一步：引用vue和vue-router ，Vue.use（VueRouter）/* eslint-disable*/import Vue from 'vue'import Router from 'vue-router'Vue.use(Router)第二步：引用定义好的路由组件imp...

store.js - 实现本地存储（LocalStorage）在项目中，存储数据到本地浏览器安装：npm安装npm install store -save浏览器安装<script src="path/to/my/store.legacy.min.js"></script>cdn<script src="https://cd

Hbuilder将vue项目打包成移动端appHBuilder是DCloud（数字天堂）推出的一款支持HTML5的Web开发IDE。该软件既可以支持web代码编写，也可以将已经编写好的项目代码打包为手机APPHBuilder提供的打包有云端打包和本地打包两种，云端打包的特点是DCloud官方配置好了原生的打包环境，可以把HTML等文件编译为原生安装包。下载地址： 官网下载地址：http:/...

Vue2.0 $set()的正确使用方式问题： 在我们使用vue进行开发的过程中，可能会遇到一种情况：当生成vue实例后，当再次给数据赋值时，有时候并不会自动更新到视图上去。也就是如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。原因：受 ES5 的限制，Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter，所以属性...

使用element ui select下拉框多选，编辑状态下回显数据问题： 在项目中使用的是 element ui 组件库，在使用select多选下拉框时，编辑页面不知道怎么为其赋值回显数据解析：在新增选择的时候，多选下拉框是多条数据，选择的数据是数组id格式，所以编辑回显的时候，要将回显的数组赋值给下拉框，就会有效果。验证：将多选数据以数组的形式从后台返回到前台（要整理后台返回的数据，整...

和上一篇地图选点不同的是，不带关键字智能搜索，是输入具体地址搜索。直接上代码。 <template> <span> <transition name="confirm-fade"> <div class="confirm" v-show="showFlag" @click.stop> &amp

知识点：在Vue.js项目中调用百度地图API，实现input框，输入地址关键字，在百度地图上定位到准确地址，获得到经纬度和地址。效果图步骤：申请百度地图密钥（ak）-- http://lbsyun.baidu.com/index.php?title=jspopular在index.html中添加百度地图JavaScript API接口注意：这里有上一篇文章记录的谷歌浏览器报...

vue-cli脚手架build目录下utils.js工具配置文件此配置文件是vue开发环境的wepack相关配置文件，主要用来处理css-loader和vue-style-loader。这个就是构建工具相关的东西配置解释下css-loader he style-loadercss-loader: 加载.css文件style-loader:使用<style>将css-load...

vue-cli脚手架build目录中的webpack.prod.conf.js配置文件这个配置文件是webpack生产环境的核心配置文件// 下面是引入nodejs的路径模块var path = require('path')// 下面是utils工具配置文件，主要用来处理css类文件的loadervar utils = require('./utils')// 下面引入webpa...

vue-cli脚手架config目录中的index.js配置文件是项目的一些配置变量，此配置文件是用来定义开发环境和生产环境中所需要的参数// path是node.js的路径模块，用来处理路径统一的问题var path = require('path')module.exports = { // 下面是build也就是生产编译环境下的一些配置 build: { ...

element-ui表格的滚动条样式修改当固定表格的高度时：默认滚动条样式丑方法一：直接修改表格样式，这样的效果可以实现，但是效果不是很好 .el-table__body-wrapper::-webkit-scrollbar{ /*width: 0;宽度为0隐藏*/ width: 2px; } .el-table__body-wrapper::-webkit...

0 * * * * ? 每1分钟触发一次0 0 * * * ? 每天每1小时触发一次0 0 10 * * ? 每天10点触发一次0 * 14 * * ? 在每天下午2点到下午2:59期间的每1分钟触发0 30 9 1 * ? 每月1号上午9点半0 15 10 15 * ? 每月15日上午10:15触发*/5 * * * * ? 每隔5秒执行一次0 */1 * * * ? 每隔1分钟执行一次0 0 5-15 * * ? 每天5-15点整点触发0 0/3 * * * ? 每三分钟触发一次0

vue里表单验证的v-model.number的坑问题：表单验证正则匹配数字，但输入汉字仍然通过原因：.number会将input里的值用parseFloat()转化，这样用正则匹配数字后，输入的即使是：123四五六；也不会报错，因为123四五六被转换成了123解决办法：将.number去除即可除了.number修饰符外，还有 .lazy 、 .trim.lazy在默认情况下，v-mo...

vue中$nextTick和$forceUpdate的用法vm.$nextTick( [callback] )this.$nextTick()将回调延迟到下次 DOM 更新循环之后执行,在修改数据之后立即使用它，然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样，不同的是回调的 this 自动绑定到调用它的实例上。应用场景：在Vue生命周期的created()钩子函...

vue中directives的用法directives的用法和directives做权限按钮的功能directives的用法：export default { data() { return { }; }, directives:{ 'local-test':function(el,binding,v...

vue项目中使用sass-loader使用save会在package.json中自动添加安装这两个：npm install node-sass --save-devnpm install sass-loader --save-dev注：通常使用npm安装会出现以下报错，安装失败。（网路问题） 可以通过淘宝的npm镜像安装node-sass，解决以上问题npm install ...

Vue.js引入vue-i18n 实现国际化国际化应该都不陌生，就是一个网站、应用可以实现语言的切换实现：使用vue-i18n 插件安装依赖：npm install vue-i18n在 main.js 中引入 vue-i18nimport VueI18n from 'vue-i18n' //引用vue-i18nVue.use(VueI18n) //使用vue-i18nva...

vue2.0中router-link详解<router-link>组件支持用户在具有路由功能的应用中点击导航。通过to属性指定目标地址，默认渲染为带有正确连接的<a>标签，可以通过配置tag属性生成别的标签。另外，当目标路由成功激活时，链接元素自动设置一个表示激活的css类名.<router-link>组件的属性有：to 、replace、 append、 ...

ES6 Promise 用法讲解Promise是异步编程的一种解决方案，用于一个异步操作的最终完成(或失败)及其结果值的表示，比传统的回调函数方案更加合理。Promise是一个构造函数，自己身上有all、reject、resolve这几个眼熟的方法，原型上有then、catch等同样很眼熟的方法。var p = new Promise((resolve, reject)=>{ ...

vue的render函数(Vue.js 2.X支持)render函数的作用：render 函数 跟 template 一样都是创建 html 模板的，但是有些场景中用 template 实现起来代码冗长繁琐而且有大量重复，这时候就可以用 render 函数。render方法的实质就是生成template模板；通过调用一个方法来生成，而这个方法是通过render方法的参数传递给它的；这...

vue之mixin理解与使用混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。权重：全局mixins>局部mixins>组件里的构造函数在使用mixins时，相当于将组件内部的内容如data等方法、method等属性与父组件相应内容进行合...

Vue 的Element UI 封装 el-table和 el-agination 结合组件在后台管理系统中，经常会用到table和agination分页结合使用。封装个组件让其试用于所有的表格页面。思路：确定要封装的内容，从父组件传给子组件的内容和从子组件传给父组件的内容，熟悉父子组件间传值方法子组件：<template> <div> ...

vue-cli脚手架build目录中的webpack.base.conf.js配置文件webpack基础配置文件此配置文件是vue开发环境的wepack相关配置文件，主要用来处理各种文件的配置。// 引入nodejs路径模块var path = require('path')// 引入utils工具模块，具体查看我的博客关于utils的解释，utils主要用来处理css-loader...

vue-cli脚手架build目录下vue-loader.conf.js 文件// vue-loader的配置，用在webpack.base.conf.js中；const utils = require('./utils')const config = require('../config')//不同环境为isProduction 赋值: 生产环境为true，开发环境为falsecon...

element-UI 分页器Bug，切换页面展示数量，页码刷新重置，原来页码高亮问题Element-UI提供了分页器的两个方法，handleSizeChange和handleCurrentChange，然而在实际使用中，却发现再切换页面展示数量的时候，会出现一些BUG， 页面刷新了，高亮页码却还是上次选择的页面。可以用以下方法解决；翻看element文档中发现有current-page，当前...

关于element表单验证问题(升级版)-关于是否要显示表单前面的小红星问题： 之前做项目的时候遇到个问题,编辑页和详情页使用同一页面，通过一个标识来判断是输入框还是显示详情，在只展示详情的时候默认没有表单验证（没有小红星）在点击编辑的时候切换成输入框模式，这时表单前需要显示小红星。这时需要对rules进行判断。解决：在el-form-item里面单独写rules &lt;el-form...

spa中引入百度地图api出现警告引入百度地图之后，页面出现黄色警告：api?v=2.0&amp;ak=dm65KD93tW9zmcZys9YvKIUj:1 A parser-blocking, cross site (i.e. different eTLD+1) script, http://api.map.baidu.com/getscript?v=2.0&amp;ak=dm65KD93...

element ui实现起始时间不能大于结束时间&lt;template&gt; &lt;div class="app-container"&gt; &lt;el-date-picker v-model="formItem.palnStartTime" type="datetime" placeholder="选择日期" size="small&qu

Vuex简单入门什么是Vuex: vuex是一个专门为vue.js设计的集中式状态管理架构。状态？我把它理解为在data中的属性需要共享给其他vue组件使用的部分，就叫做状态。简单的说就是data中需要共用的属性。比如：我们有几个页面要显示用户名称和用户等级，或者显示用户的地理位置。如果我们不把这些属性设置为状态，那每个页面遇到后，都会到服务器进行查找计算，返回后再显示。在中大型项目中会有...

vue组件之间互相传值：兄弟组件通信我们在项目中经常会遇到兄弟组件通信的情况。在大型项目中我们可以通过引入vuex轻松管理各组件之间通信问题，但在一些小型的项目中，我们就没有必要去引入vuex。有几种方法：方法一：先子传父，再父传子思路：子传父：首先我们在 a.vue 组件中 ，给按钮botton绑定一个handleClick事件，事件中我们通过 this.$emit(） 方法去触发一...

vue组件之间互相传值：父传子，子传父为什么要用到组件间传值？ 答：组件实例的作用域是孤立的。这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据，也不能直接将子组件的数据传到父组件里面，所有我们要用到组件间传值。父组件向子组件传值步骤：（可传数据，方法） 首先，值肯定是定义在父组件中的，供所有子组件共享。所以要在父组件的data中定义值其次，父组件要和子组件有契合点：就...

Vue实现进度条（progressbar）组件效果图：首先我们看一下进度条组件运行出来的效果 实现过程： 子组件： 父组件：