- 博客(98)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 vue-cli项目，打包后的文件增加时间戳，增加代码拆分的配置小记
【代码】vue-cli项目，打包后的文件增加时间戳，增加代码拆分的配置小记。
2023-03-29 15:09:34
1261
原创 vue-cli3 打包去掉console，插件babel-plugin-transform-remove-console
vue项目中去掉console
2023-02-22 11:23:02
188
原创 vue-cli3配置生产的环境变量和开发的环境变量小记
1.vue-cli3 搭建的项目，目录更简洁，之前配置的config文件已经去掉，都整合到了vue.config.js 里去配置；2.以往需要在config中文件一些生产环境，或者跨域处理现在需要自己在跟目录下创建相应的文件来配，如下： 默认情况下，一个 Vue CLI 项目有三个模式： （1）development 模式用于 vue-cli-service serve （2）test 模式用于 vue-cli-service test:unit （3）production 模式用于 vue-cl
2020-12-25 18:18:49
694
原创 vue重置form表单代码小技巧
1.直接把表单对象置空； this.form={ name:"小明", age:120 }//直接清空 this.form={ name:", age:0 }2.使用 this.$options.data() this.form={ name:"小明", age:120 }//调用方法this.form =this.$options.data().form;
2020-12-21 11:36:01
1606
原创 vue+vantUI+高德地图构成的地图选址组件
效果图如下：主要功能：搜索，分页，距离显示，选择地址，移动地图查询附近相关地点。1.首先在index.html引入高德地图的js； <!-- 高德地图的引用 --> <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你的key"> </script> <!--引入UI组件库（1.0版本） --> <script src
2020-10-09 15:06:04
2349
8
原创 vue-cli3用vant框架rem适配方案
1.在node安装插件npm install lib-flexible postcss-pxtorem --save 2.在main.js 文件中引入 import ‘lib-flexible/flexible.js’,//main.jsimport 'lib-flexible/flexible.js'3.在package.json文件中引入; 或者在vue.config.js 中配置;//package.json"postcss": { "plugins": {
2020-07-06 18:22:24
684
原创 nodeJs的安装与npm的全局配置理解
1. nodeJs的安装；1.1）下载安装包，推荐直接到官网下载： https://nodejs.org/zh-cn/download/1.2）安装包下载直接安装就可以了，next–>finish。1.3）验证安装是否成功:运行cmd，输入node -v ;如果出现下图所示，代表安装成功;一般会出现 错误，表示需要配置环境了；重点配置npm的环境问题；2.npm环境变量的配置2.1）一般来说，我们安装的时候，环境的默认配置都在C 盘，npm的缓存以及全局安装包都在C盘，这个时候，只
2020-06-29 11:20:31
2567
原创 js中的基础数据类型简单理解
js中的原始数据类型: number、string、boolean、undefined、null、object；1)number:数字类型(整数和小数);2)string:字符串类型(的值一般都是用单引号或者是双引号括起来);3)Boolean:布尔类型(值只有两个,true(真1),false(假0));4)undefined:未定义,值只有一个:undefined;5)null:空类型,值只有一个:null,一个对象指向为空了,此时可以赋值为null，只能自行赋值null，没有什么操作之后返
2020-06-23 22:28:39
181
原创 自调用函数的初步理解（一）
自调用函数的初步理解步骤：//函数的自调用，自调用函数，页面加载后，这个自调用函数就执行完了，声明的时候直接调用了，不能再调用了 ，分号一定要加上// 分步骤理解： 1) 函数的普通调用方式： function f1(){ console.log("函数"); }; f1(); //函数调用 2) 延伸——可以换种写法： (function f1(){ console.log("自调用函数222sss2"); })(); 3) 延伸——再精简一下，可以去掉方法名：.
2020-06-21 19:49:11
753
原创 原型链的初步理解（一）
实例对象使用的属性或者方法，先在实例对象中找，找到了直接使用，如果找不到，就去实例对象__proto__指向的原型对象中找，找到了直接使用，如果找不到，就报错；1）为内置对象添加原型方法： Array.prototype.mySort=function(){ console.log(this+"哈哈哈，冒泡排序");}String.prototype.sayHi=function(){ console.log(this+"哈哈哈，你好");}var arr =[1,2,3,21,10,2
2020-06-20 23:18:30
170
原创 构造函数和实例对象和原型对象之间的关系
实例对象中有一个属性： __proto__,也是对象，叫原型，不是标准的属性，是浏览器使用的；构造函数中有一个属性：prototype ，也是对象，叫原型，是标准的，程序员使用；初步理解构造函数，实例对象，原型对象之间的关系；1）构造函数可以实例化对象，先有构造函数，再有实例对象；2）构造函数的prototype属性 指向的就是构造函数的原型对象(prototype)；3）构造函数的原型对象(prototype) 中有一个构造器(constructor),这个构造器指向的就是自己所在的原型对象
2020-06-19 22:51:51
471
原创 初步理解面向对象与面向过程
js简单写法：需求：点击input按钮，改变一个div的样式;1.面向过程写法： <input type="button" value="点击0" onclick="changeColor()"/> <p id="p0">窗前明月光，疑是地上霜</p> <script> function changeColor(){ let ele = document.getElementById('p0');
2020-06-18 16:19:14
215
原创 js原型的初步理解（一）
<script> //提取方法，节省内存空间，解决数据共享问题，但是这种写法会产生命名冲突 function myPlay(){ console.log("打王者荣耀"); } //普通写法 function Person(name,age){ this.name=name; this.age=age; this.eat
2020-06-17 22:32:36
171
原创 通过自定义构造函数创建对象的学习小记
//自定义构造函数，先有构造函数，再有对象 function Person(name,age){ this.name=name; this.age=age;}//通过构造函数实例化对象：var per1 =new Person("小红",20); console.dir(per1);console.dir(Person);
2020-06-16 18:35:42
383
原创 js创建对象的几种方式
1.字面量法:var person={ "name":"小红", "age":19, "eat":function(){ console.log("喜欢吃榴莲"); } }//调用方式,有两种 [""] 必须加引号，不然出错person.name; person['name']; person.age; person['age']; person.eat(); person['eat'](); 2.构造函数法//它与工厂模式的区别就是首
2020-06-15 19:11:38
392
原创 vue-router 实时动态替换路由参数（(地址栏)参数）
应用场景：例如：页面上有多个tab，点击不同的tab，跳转到不同的页面上去，再次返回的时候，需要知道上次点击的是哪个tab，这样不用存缓存，直接改路由参数，然后直接返回就可以了；用法如下：import merge from 'webpack-merge';//如果路由没有参数name,就新增一个参数，如果有的话，就是修改name的值//可以修改多个参数this.$router.push({ query:merge(this.$route.query,{'name':'小米'})});
2020-06-08 17:32:58
8556
原创 element-ui组件嵌套太狠，导致input输入无效
由于弹出框嵌套了两层，导致input输入框毫无反应；后来发现是组件套用太深，vue检测不到视图更新，在失效输入框的input事件中加 this.$forceUpdate()强制刷新；<el-form-item label="测试数据：" required> <el-input v-model="test" type="number" ...
2020-04-28 09:31:20
3989
4
原创 樱花樱花想见你
**桜桜、あいたいよ**sa ku ra sa ku ra a i ta i yo i ya da ki mi ni i ma su gu a i ta i yoさくらさくら あいたいよ いやだきみに いますぐあいたいよda i jyo bu mo u na ka na i de wa ta shi ha ka ze a na ta wo t...
2020-04-01 16:09:05
440
原创 呀呀呀，终于过上了美好的生活啊
2020，这特殊的一年，过上了有WiFi，有吃的，大门不出二门不迈就是为国家做贡献的美好生活。作为一名标准的程序员小姐姐，只要有台电脑，在家云办公，是不可或缺的。但是怎么提高在家办公的效率呢？怎么抵抗住家里舒适的环境带来的诱惑力呢？怎么样完成每天的任务量呢？~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~我也不知道~...
2020-02-28 19:40:43
191
2
原创 elementUI 实现手动上传图片前判限制图片格式，大小，尺寸宽高，限制一次只能上传一个图
vue代码 <el-form-item label="图片" required> <el-upload class="avatar-uploader define-uploader" accept=".jpg, .jpeg, .png" :show-file-list="false" action :http-...
2020-02-19 19:25:10
4199
原创 在vue-cli3 项目中 引入AMap高德地图的实现代码
在vue-cli3 如何 引入并使用高德地图高德地图开发平台api接口：https://lbs.amap.com/api/javascript-api/guide/abc/prepare1.引入<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值">&...
2020-01-06 20:27:10
3043
原创 vue-cli3 里面的eslint的配置小记
1.忽略部分文件不做校验的方式。在根目录下新建一个 .eslintignore 文件，里面写入需要忽略的文件2. eslint 的配置，在根目录下新建一个vue.config.js 的文件配置，lintOnSave:false ,关闭保存就校验的模式。3.提交前运行一个校验的命令，修复文件npm run lint...
2019-12-12 08:59:07
793
原创 Vue packages version mismatch 的问题解决
解决方案：更新vue 和vue-template-compiler 为最新版本npm update vue -gnpm update vue-template-compiler -g
2019-12-09 10:13:32
445
原创 JSON.stringify()和parse()的理解小记
一 、 JSON.stringify()和JSON.parse()的区别；简单来说：JSON.stringify()将对象obj变成了字符串str，那么我就可以用JSON.parse()将字符串str还原成对象obj。在使用JSON.parse()需要注意一点，由于此方法是将JSON字符串转换成对象，所以你的字符串必须符合JSON格式，即键值都必须使用双引号包裹；二、JSON.strin...
2019-11-20 16:21:26
190
原创 vue.js 父组件和子组件获取对方的方法和属性的方式
1.父组件获取子组件的数据和方法 1.调用子组件的时候 定义一个ref <policy-info-common ref="policyInfoRef"></policy-info-common> 2.在父组件里面通过 this.$refs.policyInfoRef.属性 this.$refs.policyInfoRef.方法2.子组件获取父组件的数...
2019-11-18 11:17:33
179
原创 双十一，学会断舍离
时光如白驹过隙，今天都是淘宝天猫双十一活动的第11个年头了。在这个电商一片红红火火的时代，什么都可以网购，只需坐在家里买买买，就可以享受拆快递的快感，尤其是碰上双十一这种卖家吹嘘的超级减价活动，不买感觉自己就吃了大亏。然而如果说是网上东西越来越便宜的话，那为啥我的钱包越来越瘪了，这没有道理啊。认真想想，是自己抵制不了诱惑，容易一时冲动买些平常基本用不上的东西，或者是喜欢囤积物品，然后用的时候根本就...
2019-11-11 17:29:35
249
原创 Vue-Devtools安装和配置小记
1.安装，在github下载：git clone https://github.com/vuejs/vue-devtools2.在vue-devtools目录下安装依赖包cd vue-devtoolscnpm install 3.修改manifest 文件把"persistent":false改成true4.编译代码npm run build5.扩展Chrome插件谷歌...
2019-11-07 14:33:57
250
原创 Vue element-ui父组件控制子组件的表单校验
方法一：父组件代码：<template><div> <child-form ref="childRules" :addForm="addForm" > </child-form> <el-button @click="saveForm()" size='medium'>保 存</el-button>...
2019-11-06 15:10:52
10962
8
原创 JavaScript 中的 continue break retrun 的区别
主要是看看，在循环中，这三者的区别；<script> function fun1(){ loop1:for(var i =0 ;i<3;i++){ //循环一 for(var j=0;j<5;j++){ //循环二 if(j == 1){ ...
2019-08-20 16:29:07
195
原创 element-ui 开发小计
1.elementUI table组件获取表格当前行的索引可以参考如下图使用方法：其中column,KaTeX parse error: Expected '}', got 'EOF' at end of input: …{{row}}，索引值为：{{index}}2.去除输入空格<el-input v-model.trim="userName" />...
2019-07-29 14:05:20
602
原创 webpack安装和打包
1、局部安装： --save-dev 缩写 -D //开发环境的安装包 --save 缩写 -S //生产环境的安装包 安装指定版本：npm install -D webpack @version 安装最新版：npm install -D webpack 安装最新体验版本：npm i -D we...
2019-06-20 15:12:42
302
原创 JS根据出生日期计算年龄
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2019-06-05 16:05:55
21002
1
原创 webpack打包vue项目之后生成的文件如何运行
我的项目里面：webpack打包之后生成的文件放在 market 目录下；所以根据官方文档可以做如下操作：npm install -g serve (全局安装) serve -s market (运行打包后的文件)这样在：http://localhost:5000 这个网址就能看到打包之后的效果了；注意：一般前端项目里面的请求是通过代理请求其他后端接口的...
2019-05-30 13:52:55
3340
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人