大补bu-CSDN博客

原创踩坑日记2-Element Plus 按需加载 loading 加载样式问题

theme: condensed-night-purple起因因为最近在学习 Vue3 + ts, UI库选择了 Element Plus但是我发现按照Element官方文档按需引入 loading 的样式不起效果文档链接在做了相关配置后但我在使用时发现loading样式没有生效(el-button 样式是有的看图)， class 是添加上了，我就疑问样式去哪了？查找问题首页看 el-button 源码，好家伙一大堆看不懂那就先不看 el-button 去看 el-l.

2021-11-30 21:08:56 4092 12

原创踩坑日记1- element-plus el-icon 最新使用指南

element-plus el-icon 最新使用指南Element Plus 团队表示正在将原有组件内的 Font Icon 向 SVG Icon 迁移，正式版本Font Icon将被弃用，于是目标是对代码进行对应的更新，Font Icon换成SVG Icon。文档： Icon 图标 | Element Plus (element-plus.org) (2021.10.12更新替换连接地址，element-plus文档网址变动了) 注意：当前图标只适用于vue3。首先更

2021-11-03 16:05:57 7716 2

转载解决微信开发者工具黑屏

在C盘搜索WeappLocalData这个文件，我这里的路径为： C:\Users\Administrator\AppData\Local\微信开发者工具\User Data\1a695ca2de1a85735f93a43fb366c83f\WeappLocalData ，在这里新建一个文件 localstorage_b72da75d79277d2f5f9c30c9177be57e.json文件内容为如下，直接复制即可。之后保存，打开微信开发者工具即可正常使用。{"show":false,"curre

2020-12-18 15:14:10 547

原创 buUI- 一个Vue UI 组件

buUI - 一个Vue UI 组件作者：大补安装使用本框架前，请在CSS中开启 border-box*{box-sizing: border-box;}Button 组件按钮组件 Button.vue 单文件组件。<template> <button class="g-button">按钮</button></template><script>export default {};</script>

2020-12-15 10:59:30 757

原创 Vue 3.0 实战，开发基于 Composition API 的 Todo Web App

一个简单的、常规的入门示例：待办事项列表。使用了 Vue 3 的 Composition API，为最初级的使用方式。在线浏览：在线地址项目地址：项目地址给个Star

2020-11-28 00:18:12 231

原创《Vue移动端全栈开发-仿微信聊天朋友圈》

一、入门项目介绍工具安装和环境搭建(nodejs,npm,mongodb)初始化项目二、后台接口1.登录（jwt,jsonwebtoken）2.注册（bcrypt）3.创建朋友圈4.通讯录5.全球公认头像（gravatar）6.下拉刷新下拉加载（better-scroll）7.上传图片（base64）参考地址8.即时通讯(Websock)三、移动端网站1.通讯录-显示好友数据2.朋友圈-界面展示3.朋友圈-数据创建4.发送消息-聊天数据保存4.发送消息-聊

2020-11-15 20:40:31 1147 2

原创闲云旅游网04（基于vue+element ui）完成机票数据列表渲染

机票列表页渲染列表数据项目GitHub地址：https://github.com/q2419068625/xianyun1.请求接口数据<template> <section class="contianer">   <div>

2020-06-06 18:23:16 2914 1

原创闲云旅游网03（基于vue+element ui）登录注册功能开发

登录功能项目GitHub地址：https://github.com/q2419068625/xianyun新建登录注册页的布局新建了登录的表单绑定了数据到datarules表单的验证提交数据到接口把数据保存到store在store新建了user.js用于保存用户的信息数据在登录成功之后调用user.js的设置用户信息的方法把用户数据渲染到header.vue// 用户管理export const state = () => ({ // 采用接口返回的数据结构

2020-06-04 16:23:54 760

原创闲云旅游网02（基于vue+element ui）

首页开发项目GitHub地址：https://github.com/q2419068625/xianyun新建公共组件在components中新建应用统一的头部组件和页脚组件。在默认布局中layouts/default.vue中导入公共组件。实现步骤头部组件在components文件夹中新建头部组件components/header.vue。  <div class="logo">

2020-06-03 22:54:01 1465

原创闲云旅游网01（基于vue+element ui）

1.初始化项目使用官网提供的脚手架工具 create-nuxt-app，创建一个nuxtjs项目。npx create-nuxt-app xianyun需要等待片刻安装依赖的下载，下载完成后可以看到下面的提示框，要求输入项目名称。这里和接下来的提示都不需要输入任何内容，回车即可，直到要求选择服务器端框架。选则Element-UI服务器端框架选择none，代表使用Nuxt的默认服务器。接下来我们来选择安装一下额外的功能包，选择安装Axios（要按下空格键选中），继续回车下一步接下来的提示

2020-06-03 11:03:25 1272 1

原创 Vue实现简易购物车父子组件传值

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .wrap{

2020-05-28 16:09:43 999

原创 Vue实现Tab栏切换

使用到了v-for 遍历生成每个liv-show 隐藏是display:‘none’@click绑定事件添加单击事件切换Tab栏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl

2020-05-25 15:07:55 851

原创 Vue指令

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> [v-clock]{

2020-05-24 22:01:27 114

原创 Vue学习笔记01

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div id="a

2020-05-24 19:43:07 125

转载 Ajax清晰请求步骤

使用原生JS发送数据的步骤1.创建XMLHttpRequest()对象var xhr = new XMLHttpRequest();2.设置请求行 open(请求方式，请求url)// get请求如果有参数就需要在url后面拼接参数，xhr.open("get","http://localhost:3000/get?uname="+uname)// post如果有参数，就在请求体中传递 xhr.open("post","http://localhost:3000/post");3.设置

2020-05-23 22:54:38 157

原创 JQ实现手风琴动画效果

HTML<div class="king"> <ul> <li class="current"> <a href="#"> <img src="images/m1.jpg" alt="" class="small"> <img src="images/m.png" alt="" class=

2020-05-16 13:46:04 714

原创 jQuery实现Tab栏切换

HTML<div class="box">  <ul class="clearfix"> <li class="active">手机</li> <li>美食</li> <li>电脑</li> <li style="border-right:

2020-05-16 13:14:35 206

原创 JavaScript仿京东放大镜

HTML<div class="box"> <div class="preview_img"> <img src="images/s3.png" > <div class="mask"></div>  <div class="big"> <img src="images/bi

2020-05-14 19:32:35 228

原创 JavaScript实现简单留言功能

HTML <div id="box"> <textarea id="text" cols="30" rows="10"></textarea> <button>发布</button> </div>CSS*{ margin: 0; padding: 0; } textarea{ resize: none;

2020-05-13 11:04:09 871

原创 JavaScript实现简单选项卡

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ mar

2020-05-12 22:09:45 259

原创 javascript反选复选框

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> ul{ ma

2020-05-11 23:12:34 443

原创 JavaScript数组去重方法之一indexOf方法

新建一个空的结果数组，for 循环原数组，判断结果数组是否存在当前元素，如果有相同的值则跳过，不相同则push进数组。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Documen

2020-05-10 21:08:04 244 1

原创 JavaScript打印图形

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> </body&g.

2020-05-10 15:01:19 2684

原创 JavaScript打印九九乘法表

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> </body&gt

2020-05-10 14:25:44 275

原创正整数判断这个整数是几位数

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> &lt

2020-05-10 13:35:13 436

原创 JavaScript实现闰年判断

Document

2020-05-10 12:43:07 916

大补bu的博客