自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(38)
  • 收藏
  • 关注

原创 vue3组件无根节点时v-show=false不生效

vue在子组件上使用v-show时,当组件没有根节点时,v-show=false仍会显示子组件内容

2022-08-25 11:05:31 2491 3

原创 sourcetree问题

sourcetree链接coding出错

2022-07-13 17:15:07 395

原创 vue组件之间的循环引用

项目场景:点击表格中的一个链接,打开数据详情的drawer,详情页组件同时使用表格这个组件。问题描述机构管理页面包含机构型号/设备号/当前机构/租购类型/配件信息等点击当前机构,跳转到机构详情页,机构详情页里里包含基本信息/功能权限/模式管理/应用管理/设备管理设备管理就是机构管理页面,从而造成组件的循环调用原因分析:—组件的循环嵌套,对应vue官方的处理边界情况-组件之间的循环引用解决方案:方案一:复制一份机构管理页面组件到详情页组件中方案二:异步调用组件component

2022-05-17 17:49:57 1697

原创 ant-design-vue 自定义日期下拉框

项目场景:使用ant-design-vue实现一个自定义日期选择的下拉框,下拉框选项中包含近一周、近一个月、最近一年和自定义日期(如下图)。问题描述这里使用 a-select 组件的 dropdownRender 对下拉菜单进行扩展。当鼠标移入到自定义选项时,展示组件 a-range-picker ,当聚焦在 a-range-picker 时,下方的日期选择出现在左上方!(由图一到图二)原因分析:提示:这里填写问题的分析:a-range-picker 组件定义浮层的容器默认为bod

2022-04-22 15:24:53 3399

原创 react扩展

1. setStatesetState更新状态的2种写法 (1). setState(stateChange, [callback])------对象式的setState 1.stateChange为状态改变对象(该对象可以体现出状态的更改) 2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用 (2). setState(updater, [callback])------函数式的setSta

2022-02-25 17:07:04 91

原创 react组件跨级通信

组件跨级通信组件关系app ==> A ==> Bapp ==> A ==> D需求:将app中的数据传递到后代组件B中// contentManage.jsimport { createContext } from 'react';export const AppContent = createContext(null)//app.jsimport React from "react";import A from "./components/A";im

2022-02-25 16:38:00 701

原创 01-css模块化

样式局部生效,命名文件为 文件名.module.css引入时作为一个对象使用(类名是对象的item项)//app.jsimport './App.css'import Child from './Child'function App() { return ( <div>app <ul> <li>111</li> <li>222</li> </ul&.

2022-02-09 20:32:41 379

原创 vue组件通信之$attrs与$listeners的使用

组件关系parent组件<template> <div> <!-- <child @method1="handleClick" @input="handleInput" msg="home组件传来的数据msg" a="另一个数据" /> --> <child data1="数据1" data2="数据2" @event="handleEvent" /> </div></template>&

2021-08-31 17:30:54 109

原创 v-bind.sync的使用

v-bind.sync在子组件中我们不能直接修改父组件传过来的prop值,一般情况下通过$emit传递事件,然后在父组件中监听这个事件,再在事件中修改这个prop值。v-bind.sync可以理解为是这种方式的语法糖。在父组件v-bind.sync可以实现props的双向绑定v-bind.sync与v-model的区别?一个组件可以多个属性用.sync修饰符,可以同时"双向绑定多个“prop”,而并不像v-model那样,一个组件只能有一个。v-model针对更多的是最终操作结果,是双

2021-08-31 16:19:43 3577

原创 Windows常用快捷键

Ctrl+H 替换Ctrl+End 将插入点移到文档的结尾Ctrl+Home 将插入点移到文档的开始Ctrl+L; 选中地址 聚焦到地址栏Ctrl+E; 地址栏内容为空,输入内容为关键字,聚焦到地址栏Ctrl+N 新建窗口 记事本下会关闭原来的窗口,新建一个空的Ctrl+Tab 向前遍历选项卡—下一个Ctrl+T 浏览器新建标签Ctrl+W 关闭浏览器当前标签Ctrl+Shift+End 选中从插入点到文档结尾之间的文本Ctrl+Shift+Ho

2021-08-27 14:46:39 167

原创 vue.config.js常用配置

package.jsonvue-cli-service serveES6Vue项目–devServer.proxy代理配置详解const proxy = require('http-proxy-middleware');module.exports = { devServer:{ host: 'localhost',//target host port: 8080, //proxy:{'/api':{}},代理器中设置/api,项目中请求路径为/api的替换为t.

2021-08-27 14:35:44 266

原创 将本地项目托管到github或码云中

将本地项目托管到github或码云中// 在码云中新建仓库// 1.填写仓库名称(假设叫newStore)// 2.将 使用Reame文件初始化这个仓库 的√ 取消掉// 创建// git 全局配置git config --global user.name "hi518"git config --global user.email "2362391092@qq.com"// 到项目根目录下// 1. shift + 右键 打开PowerShell终端// 2. 检查文件状态,发现有一

2021-04-02 16:18:57 143

原创 nodejs+express服务器

插件上传文件

2021-03-30 22:55:11 92

原创 JavaScript知识点总结

js1.1 EC(G),VO,GOEC:执行上下文VO:变量对象GO:全局对象[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-oyjPPv86-1617025064455)(C:\Users\尘寰\AppData\Roaming\Typora\typora-user-images\image-20201227083525635.png)]1.1.2 定义变量有var与没有var区别在全局代码中,加var会提升,没有var的不会提升不管加没加var的全局变量

2021-03-29 21:38:40 1236

原创 Vue学习链接

vuevue基础知识总结——>一篇搞定vue使用install函数把组件做成插件方便全局调用关于vue中的$符号总结一下(注意下面ES6用法)Vue作用域插槽详解(<slot>、v-slot、slot-scope)——>一篇搞定Vue父子组件传值(含实例)vue-routerRouter总结(含生命周期钩子内容)——>一篇搞定vue-router导航守卫,不懂的来vue 路由过渡动效vue路由懒加载及组件懒加载vuexvuex详解总结——>一篇搞定

2021-03-29 21:34:20 61

原创 http等网络协议

DNS解析?DNS:DomainName Server(域名服务器)作用:域名与对应的IP转换的服务器特征:DNS中一张域名与与对应的IP地址的表一个域名对应一个IP地址,一个IP地址可以对应多个域名gTLD:generic Top-LEvel DNS Server 顶级域名服务器为所有.com、.net…后缀做域名解析的服务器输入域名后,首先访问DNS本地服务器。如果有,直接返回IP地址;如果没有,访问根服务器,一般根服务器中找不到,再去.com域服务器中找。找到

2021-03-23 19:47:13 146

原创 js原型与继承

js原型与继承1 原型的初步认识1.1 代码体验原型可以理解为父一级 proto /** * 普通对象 */ let obj = {}; console.log(obj) //__proto__: Object1.4 原型方法与对象方法优先级对象中自己有的用自己的,没有再找原型 /** * 原型方法与对象方法相比较 */ let hi = { show() { console.log

2021-03-23 19:40:11 182

原创 express搭建服务器

01 项目初始化# 01-项目初始化 # 生成 package.json 文件npm init -y# 02-关联远程仓库git init# 03-在项目根目录下创建 .gitignore 文件,此配置文件用于设置哪些文件不用上传到github上02 安装项目依赖# 安装项目依赖npm i express mongoose --save03 新建文件目录# 01-创建 public 文件夹 用于存储客户端所用的样式、脚本、静态文件等# 02-在public文件夹下创建 c

2021-03-23 19:21:34 145

原创 MongoDB数据库操作与mongoose的使用

MongoDB数据库操作# 打开数据库mongod# 连接数据库mongo# 退出连接exit1. 基本命令# 查看显示所有数据库show dbs# 查看当前操作的数据库db# 切换/创建 数据库use 数据库名称use itcast# ------------------------------------------------# 创建集合,添加数据 db.students.insertOne({"name":"Jack"}) # 查看集合 sho

2021-03-23 19:18:58 234

原创 express-配置及使用

起步初始化模板处理路由设计功能请求方法请求路径get参数post参数首页get/students添加学生页面get/students/new处理添加学生请求post/students/newname、age、gender、hobbies编辑页面get/students/editid处理编辑请求post/students/editid、name、age、gender、hobbies处理删除请求get

2021-03-23 19:13:10 703

原创 ajax总结

1 后端基础ajax1.1 URL互联网资源都有一个URL:统一资源定位符 uniform resouce locator资源:网页,图片,视频,程序,链接…htttp://www.baidu.com/phone?name=‘wangcai’&age=100协议:http://IP地址/域名:baidu.com , www仅仅是前缀baidu.com ,一级域名(我们买的就是这个)www.baidu.com ,二级域名 ,(自己配的)news.baidu.com ,二级域

2021-03-22 15:35:37 162

原创 fs.readdirSync()的使用记录

项目场景:使用nodejs里的fs.readdirSync()读取imgs文件夹下的所有图片文件名。报错:Error: ENOENT: no such file or directory, scandir ‘…/public/img/’问题描述:初步猜测路径格式出错,测试fs.readdirSync(’./’)打印结果:原因分析:fs.readdirSync()应该是从项目根目录下出发开始找的,修改路径名为’./public/img’,应该修改路径名解决方案:fs.readdirS

2021-03-20 14:39:44 2348

原创 VueX使用

VueX五个核心概念:state, getters, mutations, actions, modules。1. state:vuex的基本数据,用来存储变量2. geeter:从基本数据(state)派生的数据,相当于state的计算属性3. mutation:提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。回调函数就是我们实际进行状态更改的地方,并且它会接受 state

2020-11-17 01:14:42 78

原创 图片文字对齐

图片文字对齐<!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> .box { width: 600

2020-11-14 21:41:15 107

原创 鼠标cursor、轮廓outline、防止拖拽文本域resize

<!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> /* 鼠标cursor */ /* cursor:d

2020-11-14 21:18:52 167

原创 文本在一行显示

<!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> .box { width: 100px;

2020-11-14 20:51:00 664

原创 盒子模型的外边距塌陷和合并问题及解决方案

<!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> * { margin: 0; pad

2020-11-14 18:08:23 321

原创 web前端成长之路

htmlcssjsjqueryvuevue使用install函数把组件做成插件方便全局调用工具类阿里字体图标文档类

2020-11-14 16:56:48 112

原创 清楚浮动

1.额外标签法<div style="clear:both;"></div>//或者下面<br style="clear:both;" />2.父级添加overflow:hidden;,触发BFC的方式实现清除浮动效果3.:after 案例:百度 淘宝网 网易 .clearfix::after{ content: "."; display: block; height: 0; cl

2020-11-14 15:58:52 152

原创 vue使用install函数把组件做成插件方便全局调用

1.首先新建一个Cmponent.vue文件<template> <div class="toast" v-show="isShow"> <div>{{ message }}</div> </div></template><script>export default { name: "", data() { return { message: "", isSh

2020-11-13 16:42:48 856 1

原创 Array 类型方法总结

Array 类型数组定义: 数据的有序列表。不同点: 与其他语言不同的是,ECMAScript数组的每一项可以保存任何类型的数据。数组大小: ECMAScript数组的大小可以动态调整,即随着数据的增加自动增长。创建数组的基本方式使用Array构造函数。如下面代码:var colors = new Array();var colors = new Array(20);var colors = new Array("red","blue","green");使用数组字面量表示法。数组

2020-11-02 11:14:21 615

原创 时间戳转成时间格式化字符串

如何将时间戳转化成时间格式化字符串?时间戳:1535694719(秒)将时间戳转成Data对象const date = new Date(1535694719* 1000);将data进行格式化,转成对应的字符串一般调用封装好的函数formatDate(date, fmt)showDate(value) { //将时间戳转换成date对象 const date = new Date(value * 1000); //将date进行格式化 return formatDate(date,

2020-10-17 16:36:45 1706

原创 supermall-tabbar切换保留原来位置

tabbar切换保留原来位置一、让home保持原来的状态1.取消路由切换自动销毁(给router-view加keep-alive标签)//App.vue<template><div id="app"> <keep-alive> <router-view/> </keep-alive> <main-tab-bar/></div>2.让Home保持原来的位置离开时,保存一个位置

2020-10-15 15:27:43 91

原创 vue cli2简单配置

vue cli2脚手架的简单配置代码如下(示例):在项目文件夹下输入命令 vue init webpack vuecli2text(vuecli2text是自己命名的)test> vue init webpack vuecli2text? Project name vuecli2text? Project description test vue cli2? Author ? Vue build standalone ? Install vue-router? No? Us

2020-10-03 21:44:48 673

原创 使用vscode在项目里本地安装webpack进度条不动

项目场景:在学习使用webpack时,发现在vscode当中无法使用npm install 安装相应的东西,并且没有任何错误提示,仅能看到进度条不动的情况。问题描述:vscode执行npm install webpack 进度条不动PS C:\Users\尘寰\Desktop\test> npm install webpack --save-dev[..................] / rollbackFailedOptional: verb npm-session c3a9fa7cd

2020-09-29 16:26:49 820

原创 slot插槽、具名插槽,作用域插槽的使用

文章目录前言一、slot的基本使用1.使用步骤2.图片分析3.运行效果4.代码二、具名插槽的使用1.使用步骤2.图片分析3.对比效果4.相应代码三、作用域插槽的使用1.使用步骤2.图片分析3.对比效果4.相应代码总结前言slot插槽使组件具有扩展性。这部分我们要学习slot的基本使用、具名插槽的使用以及作用域插槽的使用一、slot的基本使用<slot> 元素作为组件模板之中的内容分发插槽。<slot> 元素自身将被替换。详细用法,请参考下面教程的链接。slot插槽使

2020-09-28 11:49:47 1089

原创 Vue通信(子传父)

子组件向父组件传递数据简单理解:子组件通过触发事件生成自定义函数,父组件通过调用自定义函数去实现相应的方法。第一步子组件模板有触发事件,本例中<button v-for=‘item in categories’ @click=‘btnClick(item)’>;@click='btnClick(item)调用 methods: {btnClick(item){//自定义函数item-click(用于发送)this.$emit(‘item-click’,item)}}第二步

2020-09-26 09:26:26 163

原创 大风车

html+css 大风车制作效果展示相应代码刚学完html和css,做着玩!效果展示相应代码<!DOCTYPE html><html lang="zh_CN"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>大风车</titl

2020-06-04 19:54:35 318

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除