米小猿-优快云博客

原创 react——实现父子组件的传值

需求：当页面中存在一个收藏图片，初始状态是未收藏，点击后显示收藏状态，于此同时父组件存在一个按钮，按钮的状态会跟随子组件中收藏未收藏的状态的改变而改变。同时实现取消收藏的效果。效果：父组件： import React, { useRef, useState } from "react"; import Son from "./son"; const Father = () => { const [parentData, setParentData] = useStat..

2022-01-14 15:43:28 361

原创用css创建一个三角形

主要用到了盒子模型的均分原理单独三角形效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>三角形</title> </head> <style> .box { margin: auto; width: 0; height: 0; border: 6px solid transparent

2021-10-10 22:20:38 133

原创 js简单模态框

如图先完成一个按钮，在点击按钮时出现模态框  <div class="btn"> <button id="open">click me</button> </div> .btn button { background-color: dodgerblue; border: 0 solid dodgerblue; border-radius: 10%; margi

2021-10-10 21:40:20 874

原创让元素水平垂直居中

一、使用position+margin：auto 1、先设置父元素的相对定位 2、设置子元素为绝对定位 3、设置子元素的top right bottom left均为0 4、设置子元素的外边距为auto 二、效果展示三、代码示例 <body> <div class="box1"> <div class="box2"></div> </div> </body> ...

2021-10-10 17:18:35 192

原创创建vue项目时报错：无法加载文件

一、执行 vue init webpack 项目名时报错解决办法：以管理员身份打开Windows PoweShell 输入命令 set-ExecutionPolicy RemoteSigned 再重新创建说明：　Vue build==>打包方式，回车即可； Install vue-router ==> 是否要安装 vue-router，项目中肯定要使用到所以Y 回车； Use ESLint to lint your code=...

2021-09-27 17:01:15 456

原创学习笔记——侧边栏的实现

<div class="side" ref="refside"> <i class="el-icon-s-home" style="display: block;"><a href="">首页</a></i> <i class="el-icon-s-custom" style="display: block;"><a href=""&gt...

2021-09-27 11:48:57 222

原创记录将项目上传到gitee

一、下载git 参考【教程】Git下载、安装 - 知乎二、上传创建仓库省略找到自己要上传的本地目录右击选择Git Bash Here后会弹出一个窗口使用前可用git --help查看相关命令输入命令 git init 将我们要上传的项目变成git可以管理的仓库使用git add .将文件夹下的所有文件添加进去（注意add与.之间有空格）使用git commit -m '本次提交的说明'（说明信息必填）将文件上传到仓库（会报错，需先修改config文件）报错，..

2021-09-13 19:13:20 98

原创轮播图的实现

一、引入文件这三个一定要引入 HTML部分 <div class="c-banner">  <div class="banner"> <ul> <li><img src="../img/pic3.jpg"></li> <li><img src="../img/pic2.jpg"></li> ...

2021-09-13 15:54:13 239

原创按钮或标签如何通过不同的内容显示不同的颜色以及按钮的禁用

一、不同状态不同颜色 <el-tag size="middle" :type="btnColor(scope.row.task_status)"> {{scope.row.task_status|keyvalFilter('key',[{key: "0",val: "已完成"}, {key: "1",val: "未完成"},{key: "2",val: "已接收"},{key: "3",val: "待接收"},{key: "4",val: "已同意"},{k...

2021-09-12 22:33:14 803

原创用户表单（vue+elementui）

用户列表的内容可根据上级给的要求设置，其中添加用户以及修改需要共用页面（这边使用了dialog），我这边是使用的是引用外部页面的形式。  <el-table :data="userlist" border stripe> <el-table-column label="ID" prop="user..

2021-09-12 22:05:29 711

原创 2021-09-12记录第一个vue项目出现的问题一（如何配置路由）

一、配置路由路径二、路由配置基本结构 export const constantRoutes = [ //在这里配置路由和组件的关系 { path: '/login', component: () => import('@/views/login/index'), hidden: true }, ] const createRouter = () => new Router({ // mode: 'history', // require s

2021-09-12 21:38:06 467

m0_57661429的博客