当前位置: 首页 > news >正文

[前端] vue2的/deep/转化为vue3语法(笔记)

vue2语法示例

<style scoped lang="less">::v-deep .el-carousel__button {width: 8px;height: 3px;border-radius: 3px;}::v-deep .el-carousel__indicator.is-active button {width: 16px;}
}
</style>

在 Vue 3 中,/deep/ >>> 选择器已被废弃,因为它们与 Shadow DOM 的概念相冲突。Vue 3 引入了 v-deep ::v-deep 伪类作为非标准的解决方案来穿透 scoped 样式,但这并不是长期推荐的实践。通常,你应该考虑使用 CSS 模块(CSS Modules)或组件级别的 CSS(如使用 style 标签的 module 属性)来管理样式。

然而,如果你确实需要在 Vue 3 中穿透 scoped 限制来修改第三方组件的样式,你可以使用 ::v-deep。但请注意,这可能会在未来的 Vue 版本中移除,所以最好尽量避免这种情况。以下是使用 ::v-deep 的示例:

<style scoped lang="less">::v-deep .el-carousel__button {width: 8px;height: 3px;border-radius: 3px;}::v-deep .el-carousel__indicator.is-active button {width: 16px;}
</style>

相关文章:

[前端] vue2的/deep/转化为vue3语法(笔记)

vue2语法示例 <style scoped lang"less">::v-deep .el-carousel__button {width: 8px;height: 3px;border-radius: 3px;}::v-deep .el-carousel__indicator.is-active button {width: 16px;} } </style>在 Vue 3 中&#xff0c;/deep/ 或 >>> …...

JavaScript基础(七)

isNaN //用来判断一个变量是不是一个非数字 不是来判断是不是number类型&#xff0c;而是判断当前值能不能转为number类型&#xff0c;OK&#xff1f;懂了。 还有同学不明白&#xff0c;来看实例: <script> //isNaN(非数字)→true &#xff08;数字&#xff09;→fal…...

【DevOps】Linux 内核网络子系统全面指南与性能调优

目录 一、Linux 内核网络子系统 1. Netfilter 主要特性 工作流程 2. Traffic Control (TC) 主要特性 工作流程 3. Socket 主要特性 工作流程 二、内核参数优化 1. net.ipv4.tcp_window_scaling 2. net.core.netdev_max_backlog 3. net.ipv4.tcp_rmem 和 net.ipv4…...

mybatis-plus-ui代码生成器

mybatis-plus-generator-ui 提供交互式的Web UI用于生成兼容mybatis-plus框架的相关功能代码&#xff0c;包括Entity,Mapper,Mapper.xml,Service,Controller等 &#xff0c;可以自定义模板以及各类输出参数&#xff0c;也可通过SQL查询语句直接生成代码。 使用方法 引入mave…...

项目进度总结

完成了签到&#xff0c;老师发布签到并设置持续的时间&#xff0c;学生在规定的时间内可用签到码进行签到&#xff0c;超过时间将不在允许签到...

CheckStyle静态样式之道

优质博文&#xff1a;IT-BLOG-CN 在标准化的统一样式检查规范里&#xff0c;最为常用的统一样式工具是checkstyle插件&#xff0c;而不是国内阿里的代码规约插件。 【1】下载插件 【2】配置生效 配置生效及告警设置 【3】配置checkstyle.xml 官网地址 官网最新Releases 下面…...

2024中国振威化工装备展

2024上海国际化工设备展览会 第十六届上海国际化工装备博览会将于2024年11月19-21日在国家会展中心&#xff08;上海&#xff09;举办&#xff0c;预计参展企业1000多家&#xff0c;展览面积7万平方米&#xff0c;观众突破10万人次。展会设置石化装备、化工单元设备、化工环保…...

Docker操作之启动多个相同容器实例并nginx负载均衡

文章目录 前言 一、一些概念 1.Docker 2.nginx 二、操作步骤 1.构建compose.yaml 2.nginx配置 3.Docker compose命令 4.问题与解决 总结 前言 Docker对于开发、运维人员来说都很熟悉&#xff0c;但是对于开发人员来说&#xff0c;多数时候只需一个容器实例运行即可。…...

本地的git仓库和远程仓库

文章目录 1. 远程创建仓库2. 关联远程和本地代码3. 推送本地分支到远程4. 删除远程分支5. 分支重命名6. git pull rebase7. git merge master把本地文件删除了 1. 远程创建仓库 2. 关联远程和本地代码 上面创建完后会得到一个git仓库的链接&#xff0c;有SSH或者http的 http:…...

Google I/O 2024 干货全解读:Gemini AI 横空出世,智能未来触手可及!

Google I/O 2024 干货全解读&#xff1a;Gemini AI 横空出世&#xff0c;智能未来触手可及&#xff01; 博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》…...

深入理解JVM:介绍JVM的工作原理,包括类加载机制,内存模型,垃圾回收机制等

类加载机制&#xff1a; JVM的类加载机制主要包括加载、连接&#xff08;验证、准备和解析&#xff09;、初始化、使用和卸载五个阶段。第一个阶段是加载需求的.class文件到内存中。第二个阶段是完成对字节码的验证&#xff0c;为类变量分配内存并初始化为对应类型默认值。第三…...

Springboot+Vue项目-基于Java+MySQL的民族婚纱预定系统(附源码+演示视频+LW)

大家好&#xff01;我是程序猿老A&#xff0c;感谢您阅读本文&#xff0c;欢迎一键三连哦。 &#x1f49e;当前专栏&#xff1a;Java毕业设计 精彩专栏推荐&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb;&#x1f447;&#x1f3fb; &#x1f380; Python毕业设计 &…...

Java面经学习2

来源 https://www.nowcoder.com/discuss/619573767051800576 1.一面内容 RocketMQ延时消息&#xff08;项目用到了&#xff09;底层怎么实现的&#xff08;不会&#xff09; 消息量太大导致读消息延迟时间很长怎么办 redis为什么快&#xff08;说了内存、数据结构优化、单线…...

Java bin目录中的文件如何执行?

在 Java 项目中&#xff0c;bin 目录通常用于存放编译后的 .class 文件。如果你将编译后的 .class 文件放在 bin 目录中&#xff0c;需要确保在运行 Java 程序时指定正确的类路径。下面是一个简单的例子说明如何执行 bin 目录中的文件。 假设你的项目结构如下&#xff1a; pr…...

Kafka和Spark Streaming的组合使用学习笔记(Spark 3.5.1)

一、安装Kafka 1.执行以下命令完成Kafka的安装&#xff1a; cd ~ //默认压缩包放在根目录 sudo tar -zxf kafka_2.12-2.6.0.tgz -C /usr/local cd /usr/local sudo mv kafka_2.12-2.6.0 kafka-2.6.0 sudo chown -R qiangzi ./kafka-2.6.0 二、启动Kafaka 1.首先需要启动K…...

5.9网络协议

由网卡发送数据通过网线进行发送&#xff0c;当网卡接收到信号以后将数据传给内核数据区&#xff0c;然后由操作系统交给相应的进程。 将数据进行发送的时候需要借助于网线实现&#xff0c;这个时候会出现当传输的数据比较远的时候就借助于中继器将信号进行再生扩大&#xff0…...

QT客户端开发的注意事项

QT客户端开发是一个涉及图形用户界面&#xff08;GUI&#xff09;设计、网络编程、数据库交互等多个方面的复杂过程。以下是在进行QT客户端开发时应注意的一些关键事项&#xff0c;通过关注这些事项&#xff0c;可以提高QT客户端应用的质量和开发效率。北京木奇移动技术有限公司…...

k8s源码编译失败:Makefile:1: *** 缺失分隔符。 停止。

目录 问题解决 更换Arch或系统 问题解决 编译k8s源码的kubelet时执行make失败&#xff1a;Makefile:1: *** 缺失分隔符。 停止。 首先&#xff0c;查看文件内容 # cat Makefile build/root/Makefile 修改Makefile&#xff0c;给第一行前增加include&#xff0c;如下&…...

服务器数据恢复—拯救raid5阵列数据行动,raid5数据恢复案例分享

Raid5数据恢复算法原理&#xff1a; 分布式奇偶校验的独立磁盘结构&#xff08;被称之为raid5&#xff09;的数据恢复有一个“奇偶校验”的概念。可以简单的理解为二进制运算中的“异或运算”&#xff0c;通常使用的标识是xor。运算规则&#xff1a;若二者值相同则结果为0&…...

旅游集市数仓建设

旅游集市数仓建设 小白如何从0到1成为大数据工程师 目录 旅游集市数仓建设 1.上传数据 2.可能用到的UDF函数 3.创建所需数据库及表 1&#xff09;ODS层 ①ods_oidd ②ods_wcdr ③ods_ddr ④ods_dpi 2&#xff09;DWD层 ①dwd_res_regn_mergelocation_msk_d ②dwm_s…...

大话软工笔记—需求分析概述

需求分析&#xff0c;就是要对需求调研收集到的资料信息逐个地进行拆分、研究&#xff0c;从大量的不确定“需求”中确定出哪些需求最终要转换为确定的“功能需求”。 需求分析的作用非常重要&#xff0c;后续设计的依据主要来自于需求分析的成果&#xff0c;包括: 项目的目的…...

mongodb源码分析session执行handleRequest命令find过程

mongo/transport/service_state_machine.cpp已经分析startSession创建ASIOSession过程&#xff0c;并且验证connection是否超过限制ASIOSession和connection是循环接受客户端命令&#xff0c;把数据流转换成Message&#xff0c;状态转变流程是&#xff1a;State::Created 》 St…...

vscode(仍待补充)

写于2025 6.9 主包将加入vscode这个更权威的圈子 vscode的基本使用 侧边栏 vscode还能连接ssh&#xff1f; debug时使用的launch文件 1.task.json {"tasks": [{"type": "cppbuild","label": "C/C: gcc.exe 生成活动文件"…...

最新SpringBoot+SpringCloud+Nacos微服务框架分享

文章目录 前言一、服务规划二、架构核心1.cloud的pom2.gateway的异常handler3.gateway的filter4、admin的pom5、admin的登录核心 三、code-helper分享总结 前言 最近有个活蛮赶的&#xff0c;根据Excel列的需求预估的工时直接打骨折&#xff0c;不要问我为什么&#xff0c;主要…...

srs linux

下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935&#xff0c;SRS管理页面端口是8080&#xff0c;可…...

从零实现STL哈希容器:unordered_map/unordered_set封装详解

本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说&#xff0c;直接开始吧&#xff01; 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

Map相关知识

数据结构 二叉树 二叉树&#xff0c;顾名思义&#xff0c;每个节点最多有两个“叉”&#xff0c;也就是两个子节点&#xff0c;分别是左子 节点和右子节点。不过&#xff0c;二叉树并不要求每个节点都有两个子节点&#xff0c;有的节点只 有左子节点&#xff0c;有的节点只有…...

docker 部署发现spring.profiles.active 问题

报错&#xff1a; org.springframework.boot.context.config.InvalidConfigDataPropertyException: Property spring.profiles.active imported from location class path resource [application-test.yml] is invalid in a profile specific resource [origin: class path re…...

Linux C语言网络编程详细入门教程:如何一步步实现TCP服务端与客户端通信

文章目录 Linux C语言网络编程详细入门教程&#xff1a;如何一步步实现TCP服务端与客户端通信前言一、网络通信基础概念二、服务端与客户端的完整流程图解三、每一步的详细讲解和代码示例1. 创建Socket&#xff08;服务端和客户端都要&#xff09;2. 绑定本地地址和端口&#x…...