学习视频一些杂乱的东西

文章目录

  • ref获取dom元素
  • 监听深层的某个属性
  • ? 可选链操作符 和 ?? 双问号表达式
  • v-slot 语法糖
    • 作用域插槽
    • 动态插槽
  • 初始化数组骚操作
  • 数字滚动 -> gsap
  • style妙招
  • 新奇的原型链 object.create
  • B站笔记链接
    • JS相关
    • 设计模式
    • ajax
    • svg
    • vue3+scss
    • webpack
    • 内存泄漏

ref获取dom元素

直接给dom元素加一个ref

<div ref="xxx">xxx</div>

定义一个变量名,和dom上的ref一致

const xxx = ref()
console.log(xxx.value)

监听深层的某个属性

在这里插入图片描述
需要把其变成函数!

? 可选链操作符 和 ?? 双问号表达式

在这里插入图片描述
在这里插入图片描述
只操作undefined和null

v-slot 语法糖

取消使用 slot 和 slot-

不是具名插槽可以使用 #default

this.$slots 可以获取传过来的全部slot,用于判断很方便

作用域插槽

在这里插入图片描述
在这里插入图片描述

动态插槽

在这里插入图片描述

初始化数组骚操作

在这里插入图片描述
在这里插入图片描述

数字滚动 -> gsap

在这里插入图片描述

style妙招

css可以绑定js
在这里插入图片描述

新奇的原型链 object.create

在这里插入图片描述

B站笔记链接

JS相关

JavaScript基础教程【晓舟报告】
JavaScript进阶教程【晓舟报告】
千锋教育最新版Web前端ES6-ES13教程,JavaScript高级进阶视频教

设计模式

千锋教育web前端进阶JS内功修炼之JavaScript设计模式

ajax

千锋教育JavaScript全套视频教程(10天学会Js,前端javascript入门必备)

svg

千锋前端浠浠呀老师HTML+CSS教程,零基础web前端开发入门必看视频

vue3+scss

Vue3 + vite + Ts + pinia + 实战 + 源码 +elec

webpack

黑马程序员Vue全套视频教程,从vue2.0到vue3.0一套全覆盖,前端学习核

内存泄漏

什么是js的内存泄露?常见的内存泄露有哪些?

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/625913.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于深度学习的实例分割的Web应用

基于深度学习的实例分割的Web应用 1. 项目简介1.1 模型部署1.2 Web应用 2. Web前端开发3. Web后端开发4. 总结 1. 项目简介 这是一个基于深度学习的实例分割Web应用的项目介绍。该项目使用PaddlePaddle框架&#xff0c;并以PaddleSeg训练的图像分割模型为例。 1.1 模型部署 …

【iOS】数据存储方式总结(持久化)沙盒结构

在iOS开发中&#xff0c;我们经常性地需要存储一些状态和数据&#xff0c;比如用户对于App的相关设置、需要在本地缓存的数据等等&#xff0c;本篇文章将介绍六个主要的数据存储方式 iOS中数据存储方式&#xff08;数据持久化&#xff09; 根据要存储的数据大小、存储数据以及…

案例:应用内字体大小调节

文章目录 介绍相关概念完整实例 代码结构解读保存默认大小获取字体大小修改字体大小 介绍 本篇Codelab将介绍如何使用基础组件Slider&#xff0c;通过拖动滑块调节应用内字体大小。要求完成以下功能&#xff1a; 实现两个页面的UX&#xff1a;主页面和字体大小调节页面。拖动…

基于物联网设计的智能储物柜(4G+华为云IOT+微信小程序)

一、项目介绍 在游乐场、商场、景区等人流量较大的地方&#xff0c;往往存在用户需要临时存放物品的情况&#xff0c;例如行李箱、外套、购物袋等。为了满足用户的储物需求&#xff0c;并提供更加便捷的服务体验&#xff0c;当前设计了一款物联网智能储物柜。 该智能储物柜通…

git提交报错:remote: Please remove the file from history and try again.

1. 报错信息 remote: error: File: fba7046b22fd74b77425aa3e4eae0ea992d44998 500.28 MB, exceeds 100.00 MB. remote: Please remove the file from history and try again. git rev-list --objects --all | grep fba7046b22fd74b77425aa3e4eae0ea992d44998 2. 分析原因 e…

打架识别摄像机

随着社会治安问题的增加&#xff0c;打架事件在公共场所频繁发生&#xff0c;给社会治安带来了一定程度的威胁。因此&#xff0c;为了提高公共场所的安全性&#xff0c;可以利用现代科技&#xff0c;如人工智能和摄像技术&#xff0c;开发一种打架识别摄像机。 这种摄像机可以通…

基于 IDEA 进行 Maven 工程构建

一、构建概念和构建过程 项目构建是指将源代码、依赖库和资源文件等转换成可执行或可部署的应用程序的过程&#xff0c;在这个过程中包括编译源代码、链接依赖库、打包和部署等多个步骤。 项目构建是软件开发过程中至关重要的一部分&#xff0c;它能够大大提高软件开发效率&…

【Docker】CentOS stream 上安装 Docker 环境详细指南

文章目录 1. 定义2. 优势3. 安装1&#xff09;Linux 上安装&#xff08;强烈推荐&#xff09;2&#xff09;Windows 和 MAC 上安装 4. 验证1&#xff09;查看版本2&#xff09;运行 Hello World 总结 Docker 是一种轻量级的容器化技术&#xff0c;提供了一种在不同环境中快速、…

Maven普通工程和web工程创建

文章目录 创建项目前设置maven工程前设置工作创建项目前--》设置utf-8配置maven参数Maven普通工程和web工程创建Maven简单工程第一步&#xff1a;File–New–Project 第二步&#xff1a;选择maven然后下一步&#xff1a;填写后询选择finish初始化maven工程目录简介maven简单工程…

Rust-借用检查

Rust语言的核心特点是&#xff1a;在没有放弃对内存的直接控制力的情况下&#xff0c;实现了内存安全。 所谓对内存的直接控制能力&#xff0c;前文已经有所展示&#xff1a;可以自行决定内存布局&#xff0c;包括在栈上分配内存&#xff0c;还是在堆上分配内存&#xff1b;支…

使用vue快速开发一个带弹窗的Chrome插件

vue-chrome-extension-quickstart 说在前面 &#x1f388;平时我们使用Chrome插件通常都只是用来编写简单的js注入脚本&#xff0c;大家有没有遇到过需要插件在页面上注入一个弹窗呢&#xff1f;比如我们希望可以通过快捷键快速唤起ChatGPT面板或者快速唤起一个翻译面板&#x…

自动化革命:大象机器人的Mercury A1机械臂

引言 大象机器人的Mercury系列&#xff0c;是面向工业自动化和智能制造的新型机械臂产品线。这些机械臂不仅在设计上创新&#xff0c;还在材料选择上使用了碳纤维、铝合金和工程塑料等轻质强韧材料&#xff0c;搭载高精度谐波减速器。Mercury系列的推出&#xff0c;反映了大象机…

day2:TCP、UDP网络通信模型

思维导图 机械臂实现 #include <head.h> #define SER_POTR 8899 #define SER_IP "192.168.125.223" int main(int argc, const char *argv[]) {//创建套接字int cfdsocket(AF_INET,SOCK_STREAM,0);if(cfd-1){perror("");return -1;}//链接struct so…

部署MinIO

一、安装部署MINIO 1.1 下载 wget https://dl.min.io/server/minio/release/linux-arm64/minio chmod x minio mv minio /usr/local/bin/ # 控制台启动可参考如下命令, 守护进程启动请看下一个代码块 # ./minio server /data /data --console-address ":9001"1.2 配…

深度学习笔记(七)——基于Iris/MNIST数据集构建基础的分类网络算法实战

文中程序以Tensorflow-2.6.0为例 部分概念包含笔者个人理解&#xff0c;如有遗漏或错误&#xff0c;欢迎评论或私信指正。 截图和程序部分引用自北京大学机器学习公开课 认识网络的构建结构 在神经网络的构建过程中&#xff0c;都避不开以下几个步骤&#xff1a; 导入网络和依…

【Android+物联网】Android封装MQTT连接阿里云物联网平台

前言&#xff1a; 亲测可行&#xff0c;本文实现Android封装MQTT连接阿里云物联网平台。将MQTT协议和连接阿里云平台的操作通过Android studio写入APP中&#xff0c;并简单设计UI。实现手机APP远程控制单片机LED灯亮灭的功能。 关于《Android软件开发》&#xff0c;见如下专栏…

手拉手Vue3生命周期实战应用

每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤&#xff0c;比如设置好数据侦听&#xff0c;编译模板&#xff0c;挂载实例到 DOM&#xff0c;以及在数据改变时更新 DOM。在此过程中&#xff0c;它也会运行被称为生命周期钩子的函数&#xff0c;让开发者有机会在特定阶…

SpringAMQP的使用

1. 简介&#xff1a; SpringAMQP是基于RabbitMQ封装的一套模板&#xff0c;并且还利用SpringBoot对其实现了自动装配&#xff0c;使用起来非常方便。 SpringAmqp的官方地址&#xff1a;https://spring.io/projects/spring-amqp SpringAMQP提供了三个功能&#xff1a; 自动声…

【linux】查看Debian应用程序图标对应的可执行命令

在Debian系统中&#xff0c;应用程序图标通常与.desktop文件关联。您可以通过查看.desktop文件来找到对应的可执行命令。这些文件通常位于/usr/share/applications/或~/.local/share/applications/目录下。这里是如何查找的步骤&#xff1a; 1. 打开文件管理器或终端。 2. 导…

20240115如何在线识别俄语字幕?

20240115如何在线识别俄语字幕&#xff1f; 2024/1/15 21:25 百度搜索&#xff1a;俄罗斯语 音频 在线识别 字幕 Bilibili&#xff1a;俄语AI字幕识别 音视频转文字 字幕小工具V1.2 BING&#xff1a;音视频转文字 字幕小工具V1.2 https://www.bilibili.com/video/BV1d34y1F7…