web前端
关注
分享
扫一扫
青青子衿M
这个作者很懒，什么都没留下…
展开
-
使用vscode中的LiveServer插件实现跨域访问
只需要找到插件配置文件配置代理即可，如下图。原创 2022-07-27 11:50:37 · 2097 阅读 · 1 评论 -
echarts中legend实现排列对齐
问题：当图表中的legend过多的时候，就需要考虑 legend 进行换行，但是换行之后，图例就会无法对齐，如下图所示：解决方法1、需要对legend进行分组2、需要formatter和rich属性代码如下：option = { tooltip: { trigger: 'item' }, legend:[ { orient: 'horizontal', icon: 'circle', a..原创 2022-03-03 16:16:17 · 13106 阅读 · 2 评论 -
vue3出现此警告信息：[Vue warn]: Failed to resolve component: dpan
警告内容：runtime-core.esm-bundler.js:6870 [Vue warn]: Failed to resolve component: dpan原因：问题出现的原因是因为，你导入了组件，但是没有使用它，才引起的警告比如：<script lang="ts" setup> import { a } from 'xxxx';</script>但是在<template></template> 你并有使用...原创 2022-03-01 11:54:25 · 8460 阅读 · 0 评论 -
macbook M1芯片安装adobe总是提示“损坏了”The installation cannot continue as the installer file may be damage解决方法
macbook M1安装adobe时总是提示如下报错：报错信息：The installation cannot continue as the installer file may be damaged. Download the installer file again.解决方法：XDM经过我的不断尝试终于解决了。主要原因就是安装包版本太高了，由于我只需要AI和PS，所以只测试了这两款软件，亲测以下版本有效：注意：安装之前需要先安装CreativeCloudadobe Cre...原创 2021-08-24 09:53:29 · 14071 阅读 · 1 评论 -
国内下载vs code速度慢的解决方法
1、下载在地址栏输入https://code.visualstudio.com/，进入官网，jinxing原创 2021-06-11 09:58:45 · 663 阅读 · 1 评论 -
axios请求数据报跨域错误的解决方法
问题：在Vue.js里面使用Axios发送POST请求出现报错Access to XMLHttpRequest at 'http://xxxx' from origin 'http://localhost:9529' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is pre原创 2021-05-25 11:20:48 · 2460 阅读 · 1 评论 -
使用elementui的el-dialog组件，里面包含子组件时，用refs调用子组件时出现undefined问题
问题：使用elementui时，在el-dialog组件中套入了el-form组件，代码如下： <el-dialog :title="textMap1[dialogStatus1]" :visible.sync="dialogFormVisible1" @close="clear" > <el-form :model="trialForm" ref="ruleForm" label-原创 2021-05-24 10:05:57 · 890 阅读 · 0 评论 -
理解和使用Promise.all和Promise.race
一、Pomise.all的使用Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。具体代码如下：let p1 = new Promise((resolve, reject) => { resolve('成功了')})let p2 = new Promise((resolve, reject) => { resolve('s转载 2020-06-12 16:38:49 · 228 阅读 · 0 评论 -
解决echarts图宽度自适应问题，设置100%宽度显示100px
问题我的echarts在卡片里面，为了自适应，我设置.stat图表div的宽度为100%，但是默认设置为了100px。<nz-card [ngStyle]="{display:statShow}" class="statInfo" [nzExtra]="statTemplate"> <div #statInfo class="stat"></div></nz-card>原因图表的父容器statInfo是隐藏的，我默认设置 displ原创 2020-06-05 10:35:44 · 18513 阅读 · 2 评论 -
js获取域名的方法
说明本文实例讲述了js获取域名的方法，分享给大家供大家参考，具体实现方法如下：代码示例<script>//获取域名var host = window.location.host;var host2 = document.domain;//获取页面完整地址var url = window.location.href;</script>运行结果如下：host:www.wicode.cnhost2:www.wicode.cnurl:http://www.wico原创 2020-05-29 16:43:12 · 4022 阅读 · 0 评论 -
关于ng-alain中notice-icon组件count数量不限显示问题的解决方法
问题复现因为ng-alain的notice-icon开启了Onpush，数据绑定的时候，数据是远程请求过来的。导致初始化的时候数据无法绑定。代码如下：@Component({ selector: 'header-notify', template: ` <notice-icon [data]="data" [count]="count" ...原创 2020-05-07 09:23:31 · 538 阅读 · 1 评论 -
关于ionic3中使用ion-scroll不滚动问题的解决方案
当我们按照官网上的例子使用ionic-scroll的时候会出现不滚动的情况。官网例子如下所示：<ion-scroll scrollX="true"></ion-scroll><ion-scroll scrollY="true"></ion-scroll><ion-scroll scrollX="true" scrollY="tru...原创 2020-04-29 10:26:34 · 1090 阅读 · 0 评论 -
ionic3安卓完美解决内容被软键盘全部往上顶问题
在AndroidManifest.xml文件修改android:windowSoftInputMode="adjustPan"为 android:windowSoftInputMode="adjustPan|stateHidden"如上图修改后，重新打包: ionic cordova build android --prod。其实这样已经可以解决问题，但是在这里修改如果platform被移...原创 2019-12-30 22:34:07 · 848 阅读 · 0 评论 -
angular cli http请求封装+拦截器配置+ 接口配置文件
1、接口配置文件app.api.tsimport { Component, OnInit } from '@angular/core';/** * 接口配置文件 * baseurl * urlList */export class apiList implements OnInit { baseurl: any = ''; urlList: any = {}; c...原创 2019-09-02 20:45:14 · 787 阅读 · 0 评论 -
Angular 自定义validators的实现方法
Angular 当需要form表单需要验证时，Angular自带了许多校验器，但是很多时候自带的无法满足业务需求，这时候就需要自定义的校验器，下面通过本文给大家分享Angular2 自定义validators的实现方法，需要的朋友可以参考一下。简单说明定义一个validator定义validator 需要实现 ValidatorFn 接口源码：export interface...原创 2019-09-02 09:08:46 · 4014 阅读 · 0 评论 -
项目中引用NG-ZORRO，在使用nz-form时报错Can't bind to 'formGroup' since it isn't a known property of 'form'的解决方案
项目中引用NG-ZORRO，在使用nz-form时报错 Can't bind to 'formGroup' since it isn't a known property of 'form'component.tsimport { Component, OnInit } from '@angular/core';import { FormBuilder, FormGroup, Val...原创 2019-09-01 17:49:26 · 5886 阅读 · 2 评论 -
Angular目录结构分析、创建组件、绑定数据
一、目录结构分析e2e在e2e/下是端对端测试node_modules安装的第三方模块，项目里面所需要的各种依赖，也就是在package.json里面定义的模块，通过-npm install 安装到node_modules里面editorconfig编辑器的配置文件gitignoreGit的配置文件package.json项目的配置文件，定义项目的名称，版本...原创 2019-08-31 21:43:37 · 187 阅读 · 0 评论 -
大前端是什么？
大前端是什么？简单来说，大前端就是所有前端的统称，比如Android、iOS、web、Watch等，最接近用户的那一层也就是UI层，然后将其统一起来，就是大前端。大前端最大的特点在于一次开发，同时适用于所有平台，开发者不用为一个APP需要做Android和iOS两种模式而担心。大前端是web统一的时代，利用web不仅能开发出网站，更可以开发手机端web应用和移动端应用程序。大前端为什么出现...转载 2019-08-31 08:42:37 · 42129 阅读 · 4 评论 -
iview上传组件upload上传图片时，通过data附带参数，nodejs后台接收不到参数的解决方法
在做项目的过程中，使用了iview的upload上传组件，刚开始图片上传没有问题，但是通过data传参时，nodejs后台怎么也接收不到参数，一直显示“{}”。然后，通过百度各种查询，也一直未找到合适的解决方案。心情那叫一个沉重啊，我开始思考，为什么一切正常，参数却无法接收。于是，按照程序员解决问题的惯例，打开F12。检查网络请求，看到请求，恍然大悟：这用的是Form Data！怪自己...原创 2019-08-18 22:03:13 · 8042 阅读 · 1 评论 -
微软热更新插件cordova-plugin-code-push使用介绍
热更新原理门户盒子APP热更新使用的是微软公司提供的热更新插件cordova-plugin-code-push。什么是热更新?热更新就是动态下发代码，它可以使开发者在不发布新版本的情况下，修复 BUG 和发布功能.用户毫无感知，还可以绕过某些应用商店的长时间审核。Cordova应用程序由HTML、CSS和JavaScript文件以及任何与之相关的图像组成，这些文件由Cordova CLI捆...原创 2019-02-19 12:40:13 · 2744 阅读 · 2 评论 -
Jquery Easyui DataGrid（数据表格）实现增删改查和真分页
我使用的是html+一般处理程序。本次使用的数据库脚本代码如下：create database DataGrildDBon(name='DataGrildDB',filename='F:\\MyDB\DataGrildDB.mdf')gouse DataGrildDBgocreate table Goods(id int primary key identity(1,...原创 2018-05-06 14:04:20 · 1763 阅读 · 0 评论 -
Easyui datagrid日期格式化（史上最简单的格式化方法）
{field: 'AddTime', title: '添加时间', width: 100, align: 'center', formatter: function (value) { var dateMat = new Date(parseInt(value.replace("/Date("...原创 2018-09-15 21:06:51 · 6387 阅读 · 0 评论 -
Cordova - 设置iOS下默认语言为中文（防止某些插件、界面显示英文）
问题描述有时我们使用 Cordova 编译打包 iOS 应用后会发现，界面上有些地方文字显示的是英文，比如键盘顶部默认显示的文字：或者使用了camera 插件（cordova-plugin-camera）后，调用系统照相机拍照，底部按钮是英文的：同时调用相册时，用户界面也是英文 : 2，问题解决使用 Xcode 打开工程，将在 plist 文件里面 Loc...原创 2019-02-19 18:04:23 · 1279 阅读 · 0 评论 -
微信小程序填坑之---自定义组件
自定义组件从小程序基础库版本 1.6.3 开始，小程序支持简洁的组件化编程。开发者可以将页面内的功能模块抽象成自定义组件，以便在不同的页面中重复使用；也可以将复杂的页面拆分成多个低耦合的模块，有助于代码维护。自定义组件在使用时与基础组件非常相似。前言从去年开始接触了vue以后，就一发不可收拾，尤其是vue的一切皆组件的思想，通过数据的分离，将各功能模块组件化，也将代码再次解耦，写代码的...转载 2019-02-25 14:08:18 · 629 阅读 · 0 评论 -
使用js将多个数组对象合并成一个数组对象
本人在公司做的是前端开发，后台API传的数据是多个对象数组，但是由于业务原因，需要变成一个对象数组。我分享一下自己的解决方法，希望对你们有帮助。这是API的数据：通过转换得到的数据：转换代码如下： var data = []; re.data.map(function (value, index, array) { data = data.concat(val...原创 2019-03-14 12:03:03 · 36585 阅读 · 9 评论 -
微信小程序map组件层级过高，导致model模态框无法显示的解决方法
最近，在做一个土地划块的微信小程序，需要使用map组件。根据业务需求，需要在map上弹出一个模态框。由于map组件是原生组件，层级最高。导致模态框被覆盖在map组件下面。百度了很多，都说使用cover-view解决。但是我要是使用组件，就无法达到效果了。于是，我喝了一杯咖啡，思考着如何解决。突然，灵光一现，种种方案涌入脑海。最后我选择了下面这个方案。供大家参考。我们可以使用view组件将map...原创 2019-03-04 18:14:28 · 3937 阅读 · 3 评论 -
js修改数组对象的属性（key）名
例如：把如下data1的key名称修改成data2中的key名称data1: [ { appName: '应用1', capacity: 233456 }, { title: '应用2', key: 124535 }] data2: [ { name: '应用1', value: 233456 }, { name: '应用2', value: 124535 } ]方法：va...原创 2019-03-15 15:46:40 · 14539 阅读 · 4 评论 -
小程序之open-data userAvatarUrl头像做圆角
小程序可以在没有授权时是可以获取微信头像的信息显示的，即通过open-data获取显示，头像的type为userAvatarUrl。接下来我们会给头像加个布局class和mode,那么代码就会变成这样：这是我们会发现我们虽然class里有做圆角，可是没有起作用：所以我们得到结论：小程序open-data中的头像，我们是不能对其做圆角之类的处理。那么，我们怎样才能做到在没...原创 2019-03-13 17:55:49 · 7902 阅读 · 1 评论 -
Echarts地图制作介绍
Eacharts地图Echarts地图采用的地图数据格式是geoJson。根据业务需求需要获取不同的地图数据，但是网上提供的地图数据最小是市级别的数据。更加精确的数据需要自己制作。在ECharts中显示一个区需要单独的从省份中把这个区给扣出来，这时需要用到GEOJSON编辑工具，就是这个网站：http://geojson.io，有了编辑工具那你肯定还需要省份或者区的数据嘛，因为我们需要从省...原创 2019-03-22 16:53:37 · 3488 阅读 · 0 评论 -
微信小程序：如何在{{}}中使用函数？WXML+WXS
前言用习惯了Angular和vue的小伙伴，相信在微信小程序开发项目中也想使用{{}}绑定函数，但是很遗憾，微信小程序不支持直接绑定，那怎么办呢。还好，微信提供了wxs。下面我们就开始学习怎么使用它。开始按照常规用法，使用js中的toFixed()进行处理：<view>￥{{(cashMoney*0.02).toFixed(2)}}手续费(费率2%)</view...原创 2019-04-01 11:48:27 · 2612 阅读 · 0 评论 -
js处理url将url参数转为对象(有重复参数)
在某些情况下需要将url参数转为对象的形式，有两种情况：1、url中的参数不同。例如："?uname=dingdin&upwd=12345&favs=swimming"2、url中的参数有重复的。例如："?uname=dingdin&upwd=12345&favs=swimming&favs=running&favs=music"具体代码...原创 2019-07-18 11:53:54 · 3075 阅读 · 0 评论 -
vue使用iview采坑之MenuItem使用router-link跳转vue组件
一开始没有仔细阅读iview的官方文档，导致采坑。特别记录一下，希望能够给和我一样粗心的朋友一个帮助。我使用iview的MenuItem菜单想实现组件的跳转，想到的是使用vue的router-link进行跳转，我的代码如下： <router-link to="/about"> <MenuItem name="4"> ...原创 2019-07-19 20:29:28 · 6047 阅读 · 2 评论 -
iview给布局MenuItem标签绑定点击事件
在使用iview的MenuItem时，使用@click无法触发事件。通过排查，最后发现应该使用@click.native才可以触发事件。1、@click.native.native - 监听组件根元素的原生事件。主要是给自定义的组件添加原生事件。2、iview menu中是在mounted或者在组件dom加载前就执行了以下的赋值<Menu :theme="theme" ...原创 2019-07-20 10:06:11 · 3916 阅读 · 0 评论 -
iview踩坑之路：动态绑定Tag并动态绑定closable属性
我在做项目的过程中，有个需求需要实现input输入内容，按下回车能够动态添加tag标签。使用iview的Tag组件，我的代码如下： <Tag closable class="tagg" :color="tagsColor[index]" v-for="(item,index) of dTag" :key="index" @on-close="handleClose" ...原创 2019-07-27 09:42:14 · 5615 阅读 · 1 评论 -
Web前端面试知识总结---（不断更新中）
1、主流浏览器及其内核IE浏览器内核：Trident内核，也是俗称的IE内核；Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核；Firefox浏览器内核：Gecko内核，俗称Firefox内核；Safari浏览器内核：Webkit内核；Opera浏览器内核：最初是自己的Presto内核，后来是Webkit，现在是...原创 2019-02-28 10:55:10 · 468 阅读 · 0 评论