web前端
文章平均质量分 50
洪洪呀
前端小菜鸟
展开
-
uni-app自定义导航栏右侧做增加按钮并跳转链接
uni-app自定义导航栏右侧做增加按钮并跳转链接uni-app 在页面上的导航栏右侧做一个增加的图标 并实现跳转1. 先看效果图2. 实现思路使用阿里图标库的字体图标, 下载放入本地文件 pages页面引入即可 这里说一句 uni-app 不支持在线图标 所以需要下载下来引入到本地项目中3. pages.json文件中配置如果是要放在左边 改float : left 即可4.page的代码{ "path": "pages/repairOrder/repairOrde原创 2022-03-03 11:22:44 · 3908 阅读 · 4 评论 -
修改uni-app 或者 小程序 的复选框和单选框的大小
修改uni-app 或者 小程序 的复选框和单选框的大小在写表单的时候 总会遇到使用单选框或者复选框的时候 不管是uni-app 还是小程序 自带的总是太大了 对此我们可以修改其的css属性 修改其大小1. 原始大小复选框太大 页面整体不协调2. 添加css 修改其大小.size { transform: scale(0.8,0.8);}页面上<checkbox-group bindchange="checkboxChange"> <view class=原创 2022-01-25 16:21:16 · 3483 阅读 · 0 评论 -
uni-app开发小程序并运行起来(使用ColorUI)
uni-app开发小程序步骤详解最近接到一个项目 开发一个小程序 主要是早教的培训机构使用 打算用uni-app来开发小程序 到时候打包成小程序就可以了 主要是用uni-app配合colorui使用准备工作:工具:1、 uni-app的好伙伴 Hbuilder X2、 微信开发工具下载安装好 下载地址3、 colorUI 下载地址第一步 创建uni-app项目2. 运行并引入colorUI选择项目 → 运行 → 运行到浏览器 能运行起来说明项目没有问题接着把UI框架引入到项目中原创 2021-12-16 10:57:17 · 10837 阅读 · 0 评论 -
vue实现tab切换附带css样式
vue实现tab切换附带css样式vue会用到tab切换的地方 很简单 几句代码实现可复用 直接上代码 我是写在html页面中的1.代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>tab切换</title> <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js">原创 2021-10-09 10:34:59 · 1039 阅读 · 0 评论 -
vue+element校验输入框不能有特殊字符
vue+element校验输入框不能有特殊字符做管理后台的时候 遇到表单校验 要求是不能让用户输入特殊字符 简单散步即可 亲测有用在data() 函数处声明方法export default { data() { let validateInput = (rule, value, callback) => { if (!this.checkSpecialKey(value)) { callback(new Error("不能含有特殊字符!!")原创 2021-09-24 14:27:40 · 5846 阅读 · 1 评论 -
vue控制台报TypeError: Cannot read property ‘protocol‘ of undefined错误
vue控制台报TypeError: Cannot read property ‘protocol’ of undefined错误前两天搭建框架 引入axios后 前端刷新报出这个错误 看着很难受 解决了一下原因是因为在main.js中引入axios时 语法有错误错误代码如下import axios from 'axios'Vue.use(axios)正确代码import axios from 'axios'Vue.prototype.$axios = axios;效果图原创 2021-08-23 09:34:59 · 531 阅读 · 0 评论 -
element-UI中分页组件显示英文的解决方案
element-UI中分页组件显示英文的解决方案写vue项目的时候 使用elementUI框架搭建模板 做了一个表格 发现分页控件是英文的 先看图 在看解决方法出现的问题解决方法 在main.js中引入中文 第一个是英文 第二个是中文import locale from 'element-ui/lib/locale/lang/en' import locale from 'element-ui/lib/locale/lang/zh-CN' 解决后...原创 2021-08-19 15:48:56 · 3381 阅读 · 0 评论 -
前端常见面试题集合
web前端面试题 大厂小产均适用盒模型盒模型的组成 , 有里向外 content , padding , border , margin清除浮动的方式position : absolute / fixeddisplay : inline-block / tablefloat元素overflow !== visiblecss常用布局方式常见的有 div布局 css布局 flex布局 table布局 流式布局 响应式布局如何中断ajax请求一种是设置超时时间原创 2021-08-02 12:36:25 · 242 阅读 · 0 评论 -
使用UI框架时 css不生效 使用/deep/完美解决避免污染全局样式
使用UI框架时 css不生效 完美解决避免污染全局样式使用前端UI框架时 在页面上单独修改css 但是不生效 都是在 <style scoped> </style>这样的模式下修改 依然不生效 后来尝试了几种方法 找到了 一种最有效的方式修改前 css不生效 主要是想把 tab 修改为主题色黄色 但是他现在用的是本身ui框架统一的黑色皮肤 /* 修改tab切换原生的样式 */ .gui-segmented-control{ background-color:#原创 2021-04-16 10:46:18 · 1055 阅读 · 2 评论 -
JS判断设备访问的是PC端还是手机端
JS判断设备访问的是PC端还是电脑端最近在写官网 官网需要的是自适应的网页 但是PC和移动端的页面是不一样的 所以做了两套 PC的一套 手机的一套 项目准备上线了 既然做了两套 肯定是要手机端访问手机的页面 PC访问PC的页面 怎么办呢 用js来判断一下<script type="text/javascript"> if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { window.loca原创 2020-12-21 16:58:54 · 615 阅读 · 0 评论 -
控制台提示“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。
控制台提示“npm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。使用npm运行项目的时候 控制台提示 “npm” 项识别为 cmdlet、函数、脚本文件或可运行程序的名称。这时候通常由一下两个解决方法检查node是否安装成功 不要去看百度那些乱七八糟的教程 node傻瓜式安装 安好会自动去配置环境变量 不用管 接着去cmd中输入命令行 检查node和node自带的npm是否安装成功以管理员的身份去运行编辑器...原创 2020-12-09 17:28:22 · 379 阅读 · 0 评论 -
npm安装依赖Error: ENOENT: no such file or directory, mkdir ‘D:\‘
npm安装依赖提示Error: ENOENT: no such file or directory, mkdir ‘D:’最近在用公司提供的电脑做东西 使用npm安装依赖的时候 出现Error: ENOENT: no such file or directory, mkdir 'D:'这个错误 我当时用的是 H盘 node和项目都放在H盘安装依赖的时候 就报错 后来把node卸载 在D盘重新安装 就顺利的下载好依赖了...原创 2020-12-09 16:56:16 · 2040 阅读 · 0 评论 -
proxy配置多个代理
proxy配置多个代理做项目的时候 跟不同的后端人员对接不同的后台接口 碰巧昨天遇到同时要用两人的本地服务 怎么在proxy中配置多个人的服务呢 接着看1.找到proxy文件这是默认的 框架配置好的第一个代理的例子 只要在target中协商对应后台人员的服务地址就好2.添加第二个服务地址![在这里插入图片描述](https://img-blog.csdnimg.cn/20201027151955104.png#pic_center这里不再是api开头了 我定义的是car 记得pathRe原创 2020-10-27 15:23:48 · 6993 阅读 · 2 评论 -
React快速生成组件的快捷键 (Vscode编辑器)
React快速生成组件的快捷键 ( Vscode编辑器 )1. 前言可以说整个的大前端开发都是组件化的天下,无论从三大框架(Vue、React、Angular),还是跨平台方案的Flutter,甚至是移动端都在转向组件化开发。所以,学习组件化最重要的是它的思想,每个框架或者平台可能实现方法不同,但是思想都是一样的。2. 使用vscode快速生成组件模板因为react的基本语法都是一样的 没有不要去重复的敲 粘贴复制的也麻烦 vscode编辑器提供了一个插件 非常好用 打开编辑器 → 选择扩展原创 2020-09-27 11:40:07 · 6545 阅读 · 1 评论 -
完美解决React 注册模块报错Missing message: “menu.xxx“ for locale: “zh-CN“, using default message as fallback问题
完美解决React 注册模块报错Missing message: “menu.xxx” for locale: “zh-CN”, using default message as fallback问题前两天用ant design pro 做项目时 写完菜单时发现控制台出现了一大推警告 提示下面代码的问题 百度看了许多博主的解决方式 感觉不太行 后来找到了解决方式 实测很有用[React Intl] Missing message: "menu.系统管理员.系统用户" for locale: "zh-C原创 2020-09-17 11:07:29 · 14192 阅读 · 14 评论 -
React配合ant design pro 对表单进行校验 纯干货
React配合ant design对表单进行校验原创 2020-09-09 14:39:33 · 1703 阅读 · 0 评论 -
你必须要知道的SOLID五大设计原则
设计原则SOLID作为一个前端工程师 想要写出更多更好的代码 必须要了解的就是设计原则 这个是需要花时间才能懂的东西S.O.L.I.D 是面向对象设计和编程中几个重要的编码原则的首字母缩写 这个单词对于我们做前端的来说 真的是非常常见 在css中经常见到 下面我们来了解常见的五大设计原则常见的六种设计模式单一职责原则 简写 SRP The Single Responsibility Principle开放封闭原则 简写 OCP The Open Closed Principle里式替换原创 2020-09-09 13:34:36 · 575 阅读 · 0 评论 -
git教程从零开始
git超级实用教程 从零开始GIt是目前世界上最先进的分布式版本控制系统 没有之一 作为一名程序员 每天可以不用和人打交道 但是必须必须和git报备提交每天的日常工作 正是因为它的出现 解决了我们很多问题 比如电脑坏了 你完成的工作怎么办? Git能解决 又比如 需要分工协作 使用它来合并所有工作 等等还有很多 为什么它能这么火肯定是有必然的原因的 那我们接着看它怎么用吧一.初识gitgit是一个开源的分布式版本控制系统 用于敏捷高效的处理任何项目git与常用的版本控制工具不同的地方在于采原创 2020-09-08 09:59:53 · 315 阅读 · 0 评论 -
JavaScript中var let 和 const的区别 ( ES6版本 )
JavaScript中var let 和 const的区别 ( ES6版本 )在ES6出现之前 我们用到最多的声明变量就是var原创 2020-09-07 14:10:18 · 420 阅读 · 0 评论 -
git安装教程windows版本
git安装教程 windows版本1. 下载安装包git官网 进入后选择下面红箭头处点击直接就可以下载了 根据自己电脑系统下载相应的安装包,安装步骤就自行百度吧 我们主要看怎么使用2.安装过程使用许可声明选择安装路径选择安装组件选择开始菜单页选择Git文件默认的编辑器调整您的PATH环境选择HTTPS后端传输配置行尾符号转换配置终端模拟器以与Git Bash一起使用配置实验选项安装进度安装完成右键原创 2020-09-04 17:39:13 · 331 阅读 · 0 评论 -
超级实用的vscode插件前端开发必用
超级实用的vscode插件 前端开发必用在前端开发中,有一个非常好用的工具,Visual Studio Code,简称VS code无数个大言不惭的攻城狮,都被 VS code强大功能所折服。它的插件真的非常实用 下面给小伙伴们推荐几个我常用的安装方式打开编辑器 点击扩展 搜索插件即可1. ChinesVS Code 的中文简体语言包 对于英语差的我们巨实用2. Bracket Pair Colorizer成对的彩色括号 让括号拥有独立的颜色 便于区分3. vscode-fi原创 2020-09-04 09:57:35 · 600 阅读 · 0 评论 -
Ant Design pro入门教程
Ant Design pro入门教程最近公司再开项目 又要用antd 这次刚好给大家写一个入门安装教程 ( v5 typescript版本 ) 这套模板使用了react框架为基础哦1. 准备环境安装node进入官网下载 点击进入node官网像QQ一样下一步一步直接安装就好打开cmd 输入node-v 查看是否安装成功和版本号2. 开始使用ant design pro创建一个空文件夹 并拖拽到编辑器里 这里我用的是vscode (忽略我的文件名 刚好在做测试)打开终原创 2020-09-02 17:24:39 · 4901 阅读 · 0 评论