js正则匹配获取分组和正向反向的区别
前言 正则学习:http://www.zjmainstay.cn/regexp-one regex101网站:https://regex101.com/ 可视化正则:https://jex.im/regulex/ 正向和反向很多人都不清楚,什么是正向,什么是方向啊,为什么后面是正向,前面是方向啊 简单点说 后面为什么是正向: 你识字是从左到右对吧,字在右边,右边当然是正向(顺着你阅读方向) 前面为什么是反向: 你识字是从左到右对吧,字在左边,左边当然是反向了(反着你阅读方向) 明白了上面这些,看几个案例熟悉下吧(图+文字) 示例转载自@思否-柏拉图的理想国 example(?:pattern) 和?=pattern的区别就是?:pattern会将其匹配进内容里面 匹配pattern但不获取匹配结果，也就是说这是一个**非获取匹配(也就是不会获取这个括号里面的分组)**，不进行存储供以后使用。这在使用或字符(|)来组合一个模式的各个部分是很有用。例如factor(?:y|ies)就是一个比factory|factories更简略的表达式 /factor(?:y|ie ...
2022年11月07日刷题-CSS 如何使用服务端的字体
CSS 如何使用服务端的字体？123456789CSS 如何使用服务端的字体？A:@font-faceB:font-familyC:fontD:@font-family 答案 @font-face 解析 使用@font-face定义一个字体名称,然后使用font-family使用,就有点类似于@keyframs一样的使用 12345678910111213141516<html><head> <title>Web Font Sample</title> <style type="text/css" media="screen, print"> @font-face { font-family: "Bitstream Vera Serif Bold"; src: url("https://developer.mozilla.org/@api/deki/files/2934/=VeraSeBd.ttf&quo ...
vue的h渲染函数和customRender在ant design vue的table组件的使用
需求和解决 使用ant design vue 的table组件,没有使用插槽的情况下,我想你给我使用tooltip,这样子我就不用又写插槽又写html结构了 因为我们使用table组件,想自定义结构,一般是先使用插槽,然后插槽填写内容,比如下面做法 12345678910111213141516171819const columns = [ { title:'演示', dataIndex:'demo', slots:{customRender:'demo'}, ellipsis:true, align:'center', }, ]<a-table :columns="columns"> <template #demo={record,text}> <!--要书写的结构--> <a-tooltip> & ...
vue-router当中内置component标签(组件)的使用
说明 component 为vue内置特殊元素,一个用于渲染动态组件或元素的’元组件’ 具体可以看@官网 使用 大概使用就是使用component当中的属性is,这个is可以传入字符串,也可以传入组件 <component :is="showChildA"/> 其中 showChildA为一个组件 示例 根据不同的参数来决定渲染哪一个组件 App.vue 123456789101112131415161718192021222324252627<template> <div> 我是主页 <component :is="showComponent"></component> </div></template><script setup>import {ref,computed} from "vue";import ChildA from "./pages/ChildA.vu ...
ant-design-vue select动态下拉加载更多和加载状态的添加
需求 ant-design-vue select下拉列表当中动态加载列表,当滚动到最后的时候继续加载,没有数据了就不加载了 这里的defHttp就是axios的二次封装,你们可以替换为axios就可以 效果的话就不展示了,因为数据都是后台请求的~ 做法 用到的ant design vue组件有 a-spin加载圈圈的 a-select下拉列表 a-empty空状态的(这里自定义了空状态,使其文字替换为加载圈圈) 示例123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687//必须要写const VNodes = (_, { attrs }) => { return attrs.vnodes;}<a-select v-model:va ...
ant design vue时间范围(range-picker)自定义时间段范围
需求 最近有这么一个要求 选取时间的时候,禁止选择今天和之后的日期(因为可能没有数据嘛) 选取的时间区间端不能超过30天 做法 使用a-range-picker 添加以下属性 v-model:value="searchForm.dataTime"选取的值记录 value-format="YYYY-MM-DD"可选,值的格式 :disabledDate="disabledDateHandler"不可选择的日期(日期当中的每一天都会调用这个函数) @calendarChange="dates => dateCalc.selectDateTime = dates[0]"待选日期发生变化的回调也就是我们每一次点击选择日期,就会调用一下这一个函数,这里作用是记录下第一个选择的日期时间(也就是日期开始的时间) @openChange="_ => dateCalc.selectDateTime = ''"弹出日历和关闭日历的回调,这里弹出或者关闭日期选择的时候 ...
antd vue 多选框的全选功能实现和选中时候传入值的改变
需求 ant design vue 多选框的全选功能实现和选中时候传入值的改变,官网的实例不太好,没有仔细说明怎么更改传入的值,因为很多情况下都是显示的是中文,传入的是数字,也就是id 做法 添加下面 多选按钮和选项项 12345<a-checkbox v-model:checked="checkInfoData.checkAllInfo" :indeterminate="checkInfoData.indeterminate" @change="onCheckAllChange"><span>选择所有</span></a-checkbox> <a-checkbox-group v-model:value="checkInfoData.userSelectList" :options="checkInfoData.checkInfoDataList"></a-checkbox-group> 数 ...
ant design vue 当中的表格自定义结构超出隐藏的自适应 动态显示省略号
前言 我们知道,在ant design vue当中的table组件里面的列表项目,我们一般会使用columns属性定义列表项目,比如下面 123456789export const columns = [ { title:'姓名', dataIndex:'name', slots:{customRender: 'name'}, ellipsis: true, align: 'center', }, ] 其中有一个属性,叫ellipsis这个是设置超出部门是否是省略号的,这个属性很有用,但是如果使用了columns当中的插槽,就会失效,所以这个时候我们必须要手动设置下超出省略显示逗号,但是之前设置的查出省略总是出现这个问题,大概就是这样子,当缩小屏幕的时候,明明可以占据完全,但是依旧显示的是省略号 原来的样式(less书写)和html结构代码,其实后面改进主要是改进css样式,html结构没有改动 12345678910 ...
ant design vue自定义表单验证不生效和自定义校验内容有值后自动清除警告的方法
前置-先来看看下面预期效果是什么 当我们点击提交表单的时候,下面的输出结果是什么?红色*代表必填字段 很明显你可能会角色在**测试这一行当中会提示信息,**但是却不会 问题原因及解决 在使用ant - design vue的表单验证的时候,如果不填写name属性,那么最后校验的时候是不会进行校验的 123456<!--不进行校验,缺少name--><a-form-item label="测试" :rules="[{ required: true, message: '测试不能为空', whitespace: true },]"> <div style="position: relative;display: inline-block"> <a-input v-model:value="dataForm.name" :maxlength="20" style="wi ...
navigator.clipboard.readtext开发的时候有用,编译后测试却不生效
使用navigator.clipboard.readtext开发的时候有用,编译后测试却不生效 当然，navigator.clipboard.writeText复制也不会生效~ 原因 原因就是在本地的时候都是安全域名，编辑后在服务器上测试的时候可能使用的就是不安全域名了（比如http） 安全域包括本地访问与开启TLS安全认证的地址，如 https 协议的地址、127.0.0.1 或 localhost 。 解决 使用clipboard.js,官网https://clipboardjs.com/，具体怎么用看https://www.npmjs.com/package/clipboard 使用window.isSecureContext判断集合document.execCommand使用（不过document.execCommand废弃了,不推荐使用) 12345678910111213141516171819function copyValue = (value) => { value = value + ""; if(window.isSe ...
