WXY19951125-CSDN博客

原创【CSS】透明背景的圆角渐变边框实现方案

那想要实现一个圆角的渐变边框呢，可能会以为，两个都用上不就可以了，但事实是，这两个属性并不兼容，所以要实现一个圆角的渐变边框，就得需要曲线救国的方法了。css的渐变边框可以用下面方式实现。css的圆角边框可以用下面方式实现。

2023-08-10 17:34:44 581

原创说说vue-axios那些事

axios是vue官方推荐的调用接口的方法一、基础用法1.axios 改写为 Vue 的原型属性 (1). 安装依赖包： npm install axios --save (2). 全局引入：在main.js引用import Vue from 'vue'import axios from 'axios'Vue.prototype.$axios = ax...

2021-12-22 16:50:01 123

No 'Access-Control-Allow-Origin' header 看到这个报错就知道是跨域了。当然最简单直接的肯定是后端接口配置允许跨域访问，不过，现在前端大部分都在用框架开发，说下在vue项目下前端配置允许跨域。配置完一定要重新运行项目才会生效在src文件夹平级创建一个vue.config.js文件，添加跨域配置module.exports = { devServer: { proxy: { //配置跨域 '/api': { ...

2021-12-21 17:23:00 157

原创 http请求头：content-type参数application/x-www-form-urlencoded

在HTTP协议消息头中，使用Content-Type来表示请求和响应中的媒体类型信息。它用来告诉服务端如何处理请求的数据，以及告诉客户端（一般是浏览器）如何解析响应的数据，比如显示图片，解析并展示html等等application/x-www-form-urlencoded 定义这种格式之后，如果前端的参数直接传给后台接口，...

2021-12-16 11:22:38 1554

原创设置img标签的默认图片

img标签的属性有： src：图片路径width：宽度height：高度title：鼠标悬停在图片时显示的文字内容alt ：用来告诉浏览器当需要显示的图片找不到时显示的内容当src中的资源不存在或无法正常访问时，需要显示默认图片“default.png”。但是当onerror中设置的图片路径也不存在时就会导致浏览器一直加载这个图片资源，造成堆栈溢出错误。为了完善我们通常在后面加上this.οnerrοr...

2021-12-10 11:06:16 436

原创 Vue修饰符

一、事件修饰符1. vue普通点击事件<a v-on:click="fun"></a> <a @click="fun"></a> <a @click="fun(参数)"></a> 2. vue修饰符：.stop 阻止事件冒泡//点击child区域时只会执行函数sayChild.

2021-12-04 16:15:09 686

原创 vue项目打包填坑记2——vue项目打包后引用的图片找不到

在vue项目打包填坑记1文章中，已经解决了打包之后首页显示空白的问题，但是，又出现了新的问题，引用的图片显示不出来在网上查了一些文章，css引入图片再打包后，style-loader无法设置自己的publicPath，于是需要在build/util.js文件里改变ExtractTextPlugin的css路径publicPath，但这个配置路径不是绝对的，需要具体项目具体配置路径...

2020-07-28 17:58:14 409

原创 vue项目打包填坑记1——vue项目打包后打开index.html页面显示空白，静态资源加载不到

打包的的命令都很熟悉 npm run build打包之后生成一个名为dist的文件夹，里面是打包后的项目文件和资源。但是，打开index.html文件后却显示一片空白原因分析： config文件夹下index.js里面关于build的配置，有一个属性assetsPublicPath，默认是 '/'，意思是根目录，会从index.html所在硬盘的根目录找文件资源，自然是找不到，所以才会显示空白界面解决办法：只需要把assetsPublicPath属性改成 '...

2020-07-28 17:41:19 1321

原创前端开发工具Axure——Axure原型图查看

1.找到Axure文件夹里的 index.html，选择打开方式为IE浏览器，可以直接打开访问。打开过程中会弹出一个提示，点允许就好了2.在Chrome浏览器打开，安装插件方法。可以参考：https://www.axure.com.cn/79769/ ① 点击浏览器的右上角选择更多工具->扩展程序，打开扩展程序界面。在页面右上角打开【开发者模式】 ②下载最新扩展程序，解压得到一个axure_chrome_extension_V0.6.3的文件夹...

2020-07-16 17:22:45 1811

原创前端开发工具VScode——插件安装方法以及常用的插件

一、在线安装方法如下图片二、常用插件列表1.多人协作，每一行代码git操作提交记录：GitLens 详见：https://www.jianshu.com/p/a91cb8a2e55d

2020-07-16 16:21:51 246

原创 vue项目引用 iView 组件——Modal连续调用两次，第二次会出现一闪而过的问题

需求场景：点击一个按钮，需要弹出一个modal框，点击弹出框的确定按钮，也需要弹出一个modal框提示用户接下来的操作。不做特殊处理，会发现第二个弹出框出现一下迅速自动关掉了。原因分析：在网上查了一些资料，有人说，是因为，两层弹出框采用的是一个开关值，发生了覆盖。确切原因后续会接着查询更新临时解决方案：在第二层弹框外套层计时器，暂时解决了问题...

2020-07-16 16:02:49 2933

原创前端基础CSS——CSS实现带尖角的有背景颜色的正方形

前端开发过程中，下面这样的图标经常会遇到，当然，最简单的方法是找UI切个背景图，但是，代码的世界也不能完全靠图，那么，用css又该如何实现呢，研究了网上的大多数方法，核心就是：定位+拼图第一步，先画个长方形，设置相对定位.triangle{ width:74px; height:20px; border: 1px rgba(38,110,237,0.44) s...

2020-04-14 14:47:25 1432

原创前端开发工具VScode——设置：打开新文件夹时，默认在新窗口打开

还有一种方法：先执行 Ctrl + Shift + N打开一个新窗口，在新的窗口打开文件

2019-10-24 16:31:37 3033

原创 vue项目构建——使用 vue-cli 3.X 搭建项目

Vue Cli 3 官方文档：https://cli.vuejs.org/zh/guide/一、安装 @vue/cli更新到 3.x 之后，vue-cli 的包名从 vue-cli 改成了 @vue/cli如果之前全局安装了旧版本的 vue-cli (1.x 或 2.x)，首先需要使用以下命令卸载掉// 如果没有安装旧版本的 vue-cli 可以跳过卸载直接安装npm uninsta...

2019-04-23 15:30:33 211

原创前端开发随笔——IE9 Ajax请求失败进入error的解决办法

前端想要调用后台数据，现在都是用到了ajax请求。但由于前后端分离之后不一定在同一个域名下调试访问，必然会导致跨域问题，这篇随笔不介绍跨域问题。最近项目的开发过程中，遇到了这样的一个问题，在chrome下调试接口的时候都可以正常访问，但是在IE9下访问的时候数据都没有了，查看ajax请求过程，既然没数据，那就是请求失败了，在error的回调里打印信息，确实没进入success回调里，查阅了一些...

2019-01-16 14:03:21 1795

原创前端基础CSS——CSS单位px、em、rem、vh、vw、vmin、vmax

最近学习文档的过程中，发现了一些陌生的面孔，来学习总结一下。1、px：相对长度单位。像素单位，相对于显示器屏幕分辨率而言，是一个固定的大小。2、em：相对长度单位。相对于父级元素的字体大小，如果父元素未设置字体大小，则相对于浏览器的默认字体尺寸。3、rem：相对长度单位。相对于根元素<html>的字体大小。vh、vw、vmin、vmax是一种视窗单位，也是相对单位。它相...

2018-12-21 15:22:58 329

原创 vue项目引用 iView 组件——Form表单的单验证以及循环验证

Form表单的单验证（也就是有一个表单）<template> <div> <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80"> <FormItem label="Nam

2018-12-12 16:21:39 4013

原创前端基础JS——input输入框的oninput事件和onchange事件

在开发过程中，input用的比较多的是change事件，忽略了还有input事件。onchange——input输入过程中不会触发，失去焦点时才会触发；兼容性：所有浏览器都支持，可以用于<input>, <select>, 和 <textarea>元素。oninput——在用户输入时触发，它是在元素值发生变化时立即触发；实时触发缺陷：...

2018-12-07 11:20:05 12491

原创 vue项目构建——父子组件中调用方法的执行顺序

需求场景：使用vue-cli创建的项目，父组件LeftMainmenu.vue里通过<router-view>加载了子组件，父组件与子组件的methods里各自有方法，初始化的时候在mounted里进行了调用。预设的想法是想在父组件LeftMainmenu.vue的方法里把axios请求到的数据设置成缓存【以下用localdata替代】，然后子组件调用的方法去使用localdata...

2018-12-03 15:44:22 1986 1

原创 vue项目引用 iView 组件——Table组件的调用以及默认选中某些项

在开发过程中，会遇到这样的需求，用到了Table组件，但是一进来页面需要默认选中某些项……前期的iView的安装以及引用就不赘述了，直接切入主题：html结构如下：&lt...

2018-11-28 16:18:26 7119 2

原创 vue项目构建——使用 vue-cli 2.X 搭建项目

vue-cli 是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目。一、安装node~node.js中文官网http://nodejs.cn/下载安装包 ~执行下一步安装node.js。安装完成之后，通过cmd打开命令窗口，输入node -v和npm -v，显示版本号，安装成功。二、安装 vue-cli①、全局安装v...

2018-11-06 10:20:06 196

原创 vue项目引用 iView 组件——全局安装与按需加载

随着Vue框架的热度，出现了不少基于Vue的UI组件库，这次项目用到了 iView 这个组件库。使用方法官网很详细。官网：https://www.iviewui.com/这篇文章主要是记录一下npm 全局安装以及按需引用的用法。一、全局引用①、先安装iview npm install iview -save Tips：你可能注意npm install...

2018-11-01 17:42:12 6537

原创 vue项目引用 iView 组件——自定义组件样式不生效

开发过程中，项目引用了iView组件。但是有些样式不是我们想要的，这时候就需要自己写样式了。<style scoped>这个写法大家一定都不陌生。。。。当 <style> 标签有 scoped 属性时，它的 CSS 只作用于当前组件中的元素。这主要就解决了样式不会污染到全局以及其他组件里的样式。但是如果我们项目中用到了类似iView/Mint-ui等这些框架时，发现这么写...

2018-10-19 13:56:02 8826 2

原创 angular项目随笔——前端实现实时搜索展示搜索列表

1. 在项目中，会遇到初始化页面是一个列表，但页面中包含有一个input搜索框，输入关键字搜索的时候，列表需要实时变化，列表条目总数也需要实时变化。类似下图的需求。解决方案如下：<input placeholder="输入镜像名称查找" ng-model="projectImageKey"/><ul> <li ng-repeat="item in pr...

2018-04-16 14:06:32 3245 2

WXY19951125的博客