- 博客(34)
- 收藏
- 关注
RSS订阅原创 uni-app封装request请求，用于接口对接
一、根目录下新建 config.js 文件用于配置项目的域名const config = { base_url: '项目域名'}export { config }二、根目录下新建 utils/http.js 文件import { config} from '../config.js'export const apiResquest = (prams) => { //prams是调用的接口API的参数 //请求头设置 let headerData = {
2021-05-06 09:50:32
1339
原创 vue+elementUI项目中，如何让Element UI的Message消息提示每次只弹出一个
1.封装js，命名为message.js，代码如下：/**防止重复点击重复弹出message弹框 */import {Message} from 'element-ui';let messageInstance = null;const resetMessage = (options) => { if(messageInstance) { messageInstance.close() } messageInstance = Message(opti
2020-05-25 17:12:00
3224
原创 vue项目打包后因vendor文件过大首次加载很慢的优化方法
1.打开/config/index.js文件将productionGzip设置为trueproductionGzip: true,然后用npm安装依赖，命令如下：npm install --save-dev [email protected].打开/build/webpack.base.config.js文件找到module.exports的module中的rules，将limit设置为1000（默认为10000），如下图：3.服务器端配
2020-05-13 10:34:41
2656
1
原创 html页面适配手机端方法
在head中加：<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">注释：viewport ：用户网页的可视区域.width：控制viewport的大小，可以指定一个值，如...
2020-04-19 11:15:07
6624
3
原创 css图片的等比例自动缩放
根据父容器的自动缩放，并保持图片原来的比例。需要这样设置父容器的大小。 img{ max-width: 100%; max-height: 100%; width: auto; height: auto; } ...
2020-04-17 17:07:35
3306
1
原创 微信小程序实现点击拍照以及长按录像功能
话不多说，直接上代码，代码里面注释写的都很详细wxml文件：<!-- 相机 --><camera wx:if="{{!videoSrc}}" device-position="back" flash="off" binderror="error" class="photo"> <cover-view> <!-- 拍照按钮 --&g...
2020-04-15 10:37:15
3404
1
原创 padding影响div宽高解决方法
在开发中，有时我们不希望 padding 影响到 div 的实际宽度，为了不让padding影响整个div的实际宽度，我们可以设置一个css属性：box-sizing:box-sizing
2020-04-10 10:00:01
2105
原创 五分钟快速上手Vant组件，搭建小程序界面样式
Vant Weapp是移动端组件库 Vant 的小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，有助于开发者快速搭建小程序页面样式，文档地址：https://youzan.github.io/vant-weapp/#/intro1.从github上面下载源码文件，开源地址：https://github.com/youzan/vant-weapp2.打开文件，复制dist文...
2020-04-08 16:36:25
1161
原创 微信小程序跳转页面方法
一、跳转到 tabBar 页面wx.switchTab()方法用来跳转至tabBar页面，并关闭其他所有非 tabBar 页面，示例代码如下：wx.switchTab({ url: '/index'})二、跳转到其他页面（非tabBar页）小程序中跳转至其他页面有三种方法，这三种方法分别是是wx.redirectTo()、wx.navigateTo()以及wx.reLaun...
2019-07-23 14:18:35
5982
原创 Vuex最简单的使用方法
一、安装Vuex安装命令：npm install vuex --save二、新建store.js文件文件内容如下：import Vue from 'vue';// 引入vueimport Vuex from 'vuex';// 引入vuexVue.use(Vuex); // 使用vuex插件// Store实例export default new Vuex.S...
2019-05-14 13:58:29
385
原创 Git上传常用指令
1.切换分支git checkout develop2.拉取git pull origin develop3.提交全部改动git add -A4.提交到自己的分支git commit -m '注释'5.把自己的改动提交到主分支git push -u origin develop...
2019-04-25 11:26:59
1495
原创 Vue项目中localStorage本地储存的公共方法
创建local.js文件，文件内容如下：const local = {}/** * put 把数据放到本地存储 * @param {*} key * @param {*} value */local.set = function (key, value) { window.localStorage.setItem(key, JSON.stringify(value));}...
2019-04-19 09:56:41
2892
原创 vue中全局组件的封装与使用
一、写好组件<template> <button class="btn"> <slot/> <!-- 插槽 --> </button></template><script>export default { // 传入子组件的参数写到props props: { }...
2019-03-28 10:27:42
3414
原创 Vue生成二维码插件QRcode
一、安装在命令行中输入一下命令安装二维码插件：npm install qrcodejs2 --save需要注意的是，这里安装的是qrcodejs2而不是qrcode ，因为安装qrcode会报错。二、引入在需要的页面引入QRcode插件：import QRCode from 'qrcodejs2' 三、使用html部分：<div id="qrco...
2019-03-08 11:30:57
1199
原创 vue实现图片放大的方法
一、v-viewer插件首先，用命令行安装v-viewer插件：npm install v-viewer --save然后，在main.js中注册v-viewer插件，代码如下：// 实现图片点击放大import Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css'Vue.use(Viewer);Viewer.s...
2019-01-25 09:55:33
5482
3
原创 vue实现打印功能最简单的方法
一、下载打印插件通过这个地址下载vue打印插件：https://github.com/xyl66/vuePlugs_printjs，下载完毕后，在src下新建文件夹plugs，将下载的插件print.js放到plugs文件夹里二、全局注册打印插件在main.js里注册打印插件，注册完成后，就可以在组件中使用了，main.js里的代码如下：// vue 打印插件import P...
2019-01-23 16:45:59
13560
22
原创 基于Vue+ElementUI的省市区选择公共组件
公共组件部分此组件是配合后台用的，每选择一次，调去一次后台接口，获取相应地址的数据。html部分：<template> <el-form-item label="地址" :label-width="'100px'"> <el-select v-model="addList.province" placeholder="请选择省" cl
2018-11-02 10:22:37
19060
2
原创 JavaScript中Json字符串与对象、数组之间的相互转换
1、Json字符串转Js数组varjsonStr ='[1,2,3,4,5，{"a":1}]';varjsarr=JSON.parse( jsonStr );//转为数组alert(jsarr[0]);2、Json字符串转Js对象varjsonString ='{"bar":"property","baz":3}';varjsObject = JSON.parse...
2018-10-24 09:27:58
566
原创 Vue爬坑：把对象中的数据给了某个变量，改变一个对象的值，另一个对象也变化的解决办法！
在vue中，在data里建立两个对象。data() { return { dataA:{ a:1 }, dataB:'' }};将dataA的内容赋值给dataB，改变dataB里对象的值，发现dataA里的值也跟着变化了。为什么会出现这种情况呢？其实，这是一个引用传递而不是值传递，dataA和dataB指向的是同一...
2018-10-16 10:30:33
27732
24
原创 js中最简单最实用的数组去重方法！
js数组去重是比较常见的数组操作方式之一，网上有很多关于数组去重的博客文章，方法各式各样，但有些方法实用性很差，很容易造成不必要的麻烦，所以我们需要去其糟粕取其精华，下面我们就整理一些比较实用的数组去重方法。一、for循环嵌套，利用splice去重此方法是比较常用的方法之一，也是es5中比较实用的方法之一。话不多说，上代码：function newArr(arr){ for(...
2018-10-10 13:25:36
46906
9
原创 JS字符串与数字之间的转换方法
一、字符串转换成数字字符串转换成数字最常用的方法有两个:parseFloat和parseInt。parseFloat是把一个字符串转换为一个浮点数，parseInt是把一个字符串转换为一个整数。示例如下：var num = parseInt('123abc'); //返回123var num = parseInt('2.4'); //返回2var num = parseFloat('...
2018-09-28 13:18:34
745
原创 JS中根据某个特定字符截取字符串
在项目中，我们有时候需要将字符串根据某个字符截取出来，并获取某个值，比如字符串"1-2-3-4-5",我想获取3，怎么做呢?请看下面代码：var str = "1-2-3-4-5"var arr = str.split("-");console.log(arr)//返回一个数组['1','2','3','4','5']通过上面代码，我们用split方法把字符串str转换成了数组arr...
2018-09-20 10:09:52
54625
1
原创 VUE2.0中监听对象属性的方法
data() { return { addMealList: { name: "", price: "0", discount: "0", weight: "0", }, }; }, watch: { addMealList: { handler: functi...
2018-09-07 14:34:00
702
原创 仅需三步，即可在Vue项目中配置sass
1.安装sass依赖包在终端中输入npm install --save-dev sass-loader，下图表示安装成功：安装完sass-loader后，再安装node-sass，输入npm install --save-dev node-sass，因为sass-loader依赖于node-sass，下图表示安装成功：2.添加配置打开build文件夹下的webpack.ba...
2018-08-22 11:44:30
5960
1
原创 快速搭建vue+webpack开发环境
1.安装node.js与npm首先，你需要安装node.js与npm,如果没有安装，可以去官网安装，node.js官网地址：https://nodejs.org/en/，一般node.js都自带npm。安装完node.js后，在终端输入node -v以及npm -v查看是否安装成功，如果出现版本号，即表示安装成功，如下图： 2.安装webpack在终端输入：npm install ...
2018-08-17 10:50:52
3180
原创 vs code终端命令不能使用解决方法
今天想试一下vs code编译器，安装之后打开项目，想用终端执行一些命令，然而刚刚开局就遇到了坑，如下图： 终端竟然无法识别npm和node？什么鬼！于是，去cmd里看了下，发现cmd里可以正常使用后经四方打探，终于找到了解决方案，打开vs code属性里的兼容性，勾选以管理员身份运行，然后应用重新启动vs code，就可以运行终端命令啦！...
2018-08-17 09:13:45
64805
40
原创 js中常用的正则表达式验证方法
在项目开发中，几乎每个项目都避免不了表单验证，比如用户名验证，密码验证等等，接下来，就整理一下比较常用的正则表达式验证。1.用户名验证（字母、数字及下划线组成）var username = /^[a-z\d_]{5,20}$/i2.，密码验证（以字母开头，字母、数字和下划线组成，长度为6-18）var password = /^[a-zA-Z]\w{5,17}$/3.手机号...
2018-08-15 11:59:03
547
原创 webstorm2018最新版最简单的破解方法
webstorm是一款前端主流编译器，虽然这款编译器不是免费的，但是破解方法还是有不少的，接下来就告诉大家一种最简单的方法：首先，去官网下载最新版webstorm，官网地址：http://www.jetbrains.com/webstorm/，点击download，如下图：下载完毕点击安装，安装完成后，运行webstorm，弹出注册窗口选择Activate，在打开的License Ac...
2018-08-15 10:29:23
1281
原创 javascript中为动态生成的元素添加事件
近期在开发项目中，遇到一个问题，就是给动态生成的元素添加事件，用平常使用的方法添加不上，废话不多说，上代码：<div id="mydiv"></div><script>var html = "<div class='child'>我是动态生成的</div>"$("#mydiv").html(ht
2018-08-14 14:16:46
3218
原创 谈谈JS中“相等”与“全等”的区别
在javascript中，判断两个变量是否相等的操作符有两组，他们分别是：相等和不相等，全等和不全等。他们的区别就是相等和不相等是先转换然后比较，全等和不全等不转换只比较。相等与不相等相等是用两个等号表示，即“==”，而不相等则用叹号与等号表示，即“!=”，这两个操作符都会先转换操作数，然后在进行比较。比如：var a = ("123" == 123);alert(a);//结果为...
2018-07-22 22:37:53
1938
原创 CSS清除浮动常见的三种方法
1.结尾处添加空div标签设置clear：both在浮动的盒子之下再放一个标签，在这个标签中使用clear:both，用来清除浮动，这种清除浮动的方式会增加页面的标签，如果页面浮动布局多，就会有很多空的div，会导致造成页面结构混乱。例子如下：<style type="text/css"> .div{background:red;width:200px} .left{fl...
2018-06-26 17:11:15
240
原创 ES6中let与const的用法
let与const是ES6语法中比较常见的两个命令，下面我们就讨论一下let与const。letlet是用来声明变量的命令，它类似于var命令，但不同于var的是let是块级作用域，而var是函数作用域。那么，什么是块级作用域呢，废话不多说，直接上代码。for (let i =0;i<6;i++) {console.log(i);//有结果}console.log...
2018-06-25 10:34:07
190
原创 javascript中防止重复点击、防止点击过快实用方法
防止重复点击可以添加一个开关,让这个开关默认为true，第一次点击将其变为false,点击事件的执行需要判断这个开关是否为true，为true执行,false不执行。例子如下： var isclick= true; function click(){ if(isclick){ flag = false; //下面添加需要...
2018-06-22 15:26:52
52800
4
原创 快速理解CSS中的position定位
在CSS中，有一个非常重要的属性，几乎只要用CSS，就避免不了使用这个属性，它就是定位属性position。它可以使元素非常灵活的处于你想的位置。position属性的值有absolute、relative、fixed、static以及inherit.其中前三个值是我们开发中比较常用的，static为默认值，也就是没有定位，inherit是规定从父元素继承 position 属性的值，也很少使...
2018-06-22 15:05:58
174
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人