- 博客(221)
- 收藏
- 关注
RSS订阅
原创 vue和布局遇到的问题
显示竖直方向的滚动条第一种固定高度+overflow-y: auto;展示如下：<div class="card" style="width: 100%;margin:0 auto; height: 280px;overflow-y: auto;"> <ul class="list-group list-group-flush" v-for="detai...
2019-11-06 10:46:11
434
原创 牛客网—web前端练习
2018-12.1第一次练习1.下列哪个样式定义后,内联(非块状)元素可以定义宽度和高度：display:blockdisplay属性 :block : CSS1 块对象的默认值。将对象强制作为块对象呈递，为对象之后添加新行 可以定义高度和宽度none : CSS1 隐藏对象。与 visibility 属性的hidden值不同，其不为被隐藏的对象保留其物理空间inline : CS...
2018-12-03 14:03:22
3675
原创 webstorm使用Git上传文件
使用码云一些问题在gitee上，如果是使用.zip会多一层可以使用复制https再用git命令进行上传（不详细介绍）基本操作如下：---------------------------------------也可以在webstorm上直接克隆注意：配置git的路径要准确，配置git的路径要准确，配置git的路径要准确（重要的事情说三遍！！！）file-set...
2018-09-18 20:32:50
1676
原创 js数组中元素转为对象形式
var params = [];var info= { "uid" : "21", "url" : "https://wx-dev-image.wanxue.cn/WEB/basic-manager/company/image/20220520/f1fd9d784ccd45b39417178acb3b30a6.jpg", };console.log(info);params.push(info);console.log(params);var params = [];var inf
2022-05-20 16:59:53
1044
原创 vue获取循环dom节点
<template> <div v-for="(item, i) in programmeList" :key="item" class="special-l-one"> <span class="special-l-one-name" :ref=" (el) => { if (el) specialNameArray[i] = el; } " &g
2022-05-11 17:49:18
1644
原创 element input输入只能为数字问题
需求：只能输入数字问题：这种写法 能限制只能输入数字，其他字符不能输入，但是如果输入中文字符之后，v-model绑定的值不再更新了，再次输入的数字字符不再绑定到当前值上<el-input v-model.number="ruleForm.comment" clearable maxlength="5" oninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入排序值(最大值99999)" ref='inputTes
2022-04-21 10:30:07
1770
原创 正则使用花括号
1.花括号使用描述：在正则表达式中 {} 是一个量词, 常用来一个或一组字符可以重复出现的次数.[0-9]{4,4}[0-9]{2,4}[0-9]{2,3}如上，三个例子可以看出1.表达式 [0-9]{4,4} 匹配 四 位 0-9 之间的数字.2.表达式 [0-9]{2,4} 匹配 二到四 位 0-9 之间的数字.3.表达式 [0-9]{2,3} 匹配 二到三 位 0-9 之间的数字.注意花括号左侧数字必须小于右侧{5,3}量词范围有问题...
2022-04-19 14:55:37
2836
原创 link[rel=“icon“]
设置站点信息setSiteInfo() { const url = window.location.host; siteApi(url).then((res) => { const resData = res || {}; this.siteInfo.siteLogo = resData.frontEndLogo; this.siteInfo.siteName = resData.frontEndName; this.siteInfo.siteDefaultN
2022-04-12 14:39:42
1038
原创 element input正则校验输入数字且小数点后只能输入2位
<el-input v-model="data.score" clearable οninput="value=value.replace(/[^1-9]{0,1}(\d*(?:\.\d{0,2})?).*$/g, '$1')" placeholder="请输入指标分值" size="small" />
2022-04-02 10:44:10
2732
1
原创 typescript 中 [propName: string]的使用
其他没有使用的属性名 可以统一使用[propName: string]: number | string | boolean | Array<string>;定义类型 属性值的类型是把所有的类型都展示interface DataState { id: number | string; createTime: number; commentUserAvatar: string; commentDeleted: boolean; commentUserNam
2022-01-17 17:58:00
2584
原创 router.push特殊形式
const test1 = () => { const num = '/expert/question?id=1473477689282564097&name=畜牧业&question=true'; const x = num.split(/[?]/); var arrPath = x.slice(0, 1); console.log('arrPath:', arrPath); var arrQuery = x.slice(1, x.l
2022-01-14 15:21:59
322
原创 取出富文本转义的文本
工具函数v-html 可以转义富文本格式的内容转义格式：（初始化）`<p style="line-height: 1.2;"><span style="font-family: simsun, serif; font-size: 12pt;"><img class="wscnph" style="display: block; margin-left: auto; margin-right: auto;" src="https://wx-pro-image.wanxue.
2021-12-15 18:37:55
1126
原创 vue3生命周期
生命周期图谱典型生命周期1 beforeCreate在实例初始化之后、进行数据侦听和事件/侦听器的配置之前同步调用。2 created在实例创建完成后被立即同步调用。在这一步中，实例已完成对选项的处理，意味着以下内容已被配置完毕：数据侦听、计算属性、方法、事件/侦听器的回调函数。然而，挂载阶段还没开始，且 $el property 目前尚不可用。3 beforeMount在挂载开始之前被调用：相关的 render 函数首次被调用。该钩子在服务器端渲染期间不被调用。
2021-12-07 18:15:58
1251
原创 vue3 ts setup父子组件传值
问题描述：使用<script lang="ts" setup>标签 获取ref总是找不到，起初我以为是传染子组件先后顺序问题 增加一个setTimeout 和nexttick，但是还是找不到ref。查看资料看到这种写法增加了三个语法糖（父子组件通信）使用defineEmit,defineProps,defineExpose这里我主要是想父组件 调用子组件的方法，所以使用defineEmit还有获取ref所以使用defineExpose父组件<template> <
2021-12-07 16:06:46
3014
原创 vue3 ts proptype
目的：类型补充属性校验使用：import { computed, PropType, onMounted } from 'vue';interface otherBread { title: string; path: string; }export default { components: {}, props: { otherBreadcrumb: { type: Array as PropType<otherBread[]>
2021-12-06 10:31:47
792
原创 vue3遇到问题整理（不定期更新）
1.is="vue:script"<div is="vue:script" src="https://p.bokecc.com/player?newversion=true" type="text/javascript" />2.Volar vscode中插件的安装使用3.reatvie，ref，unref，toRef/toRefs/isRefreatvie对应用类型数据进行包裹，使其称为响应式的数据，vue不建议使用原对象（应用类型数据），而直接使用包裹后的数据，因为
2021-11-24 15:46:47
1529
原创 vue3 update:modelValue使用
v-model中update:modelValuev-model的主要原因是由于value和input事件可能另有它用，那么我们可不可以直接使用另外的属性和方法，而不需要去通过model进行定义。vue3中就实现了这个功能，v-model绑定的不再是value，而是modelValue，接收的方法也不再是input，而是update:modelValue写法：<ChildComponent v-model:title="title" />//或者<ChildCompone
2021-11-22 17:18:04
38454
原创 vue keep-alive机制
使用场景：在开发中某些情况我们希望继续保持组件的状态，而不是销毁掉，这个时候我们就可以使用一个内置组件:keep-alive使用：通常我们可以配置整个页面缓存或只让特定的某个组件保持缓存信息，配置了keepalive的路由或者组件，只会在页面初始化的时候执行created->mounted生命周期，第二次及以后再进入该页面将不会执行改生命周期，而是会去读取缓存信息1.keep-alive属性keep-alive有一些属性：include - string | RegExp | Array。
2021-11-22 16:38:16
619
原创 vue动态组件的实现和传值
动态组件的实现和传值1.动态组件的实现动态组件是使用 component 组件，通过一个特殊的attribute is 来实现<template> <div> <button v-for="tab in tabs" :key="tab" :class="{ active: currentTab === tab }" @click="tabClick(tab)" > {{ tab }}
2021-11-22 16:05:54
5592
原创 vue3 template
template 使用情况1. 根据某个状态渲染多个模板的 v-if v-else2. 插槽的场景插槽：子组件写法：name="title" <slot name="title" v-bind="{ row: typeItem, index: index }"> <div class="menuItemBox">{{ typeItem.name }}</div></slot>父组件调用写法：<template #tit
2021-11-19 15:36:33
3258
原创 sessionStorage
1.设置（变量名，变量值）window.sessionStorage.setItem('title', JSON.stringify(row))2.取值 window.sessionStorage.getItem('title') || '{}'3.使用之后需要在卸载的生命周期中清除该缓存onUnmounted(() => { window.sessionStorage.removeItem('title')})...
2021-11-10 15:37:33
1271
原创 elementUI input相关内容
1.elementUI中el-input输入数字且保留指定小数位<el-input v-model="item3.val" class="suvi_num_input_second_num" clearable οninput="if(isNaN(value)) { value = parseFloat(value) } if(value.indexOf('.')>0){value=value.slice(0,va
2021-10-28 10:35:11
284
原创 js数组一些操作
1.push之后原数组和push之后的元素为什么值，push会改变原数组const a = [2, 3, 4];const b = a.push(5);console.info(a); // [2,3,4,5]console.info(b); // 42.js中数组push对象，前面的值总是被最后一次的值覆盖的问题js中定义了一个数组，每次往里面push对象，结果最后一次push的对象会覆盖之前push进去的值。var data = { a:'123', b: '456', c: '78
2021-07-13 15:29:04
199
原创 vue3脚手架安装
一.准备1.官网链接 安装node检查node 版本node -v2.全局安装vue-cli3.0脚手架卸载：如果已经全局安装了旧版本的vue-cli(1.x 或 2.x)，需要先卸载：npm uninstall vue-cli -g安装：npm install -g @vue/cli查看vue版本：vue -V3.创建vue3项目二.创建vue3项目1.创建 项目名称 编写 vue create proname注意：项目名称不支持大写字母2.输入命令选择选项（
2021-07-08 11:37:11
5039
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人