【Blazor】Blazor学习笔记

1. 布局
如何创建布局,也就是页面的模板
@inherits LayoutComponentBase
必须继承LayoutComponentBase
当然也可以在其他的布局的基础之上,嵌入自己的自定义布局形成新的布局
@layout 其他布局
====
@inherits LayoutComponentBase->布局基类
@layout MainLayout->其他的布局

@Body
====
如何选择布局应用的范围
1. 针对个体
在razor文件开头就写
@layout 某某布局
2. 针对范围
利用_Imports.razor,在指定文件夹下的所有布局都会按照_Imports.razor来处理

2. 组件
如何创建一个组件
前端+C#
注意组件前面要加@rendermode InteractiveServer
因为组件是需要交互的

如何单向绑定
需要绑定的对象在C#代码区加[Parameter],并且public,前端区@变量名访问
仅仅是C#->前端的数据流向

如何访问DOM
@onxxxx,就可以访问html组件的DOM事件了,之后可以@与C#区域联动,或者直接上lambda表达式
访问某些事件是具备属性的,@onxxxx:yyyy,输入:可以弹出事件的一些属性来,相当于进一步细化事件的使用。

如何双向绑定
就是实现数据在前端区域和C#区域双向传递
@* @bind 和 @bind-value 的区别 *@
@* 特性                @bind                                @bind-value *@
@* 语法简洁性        更简洁,适合大多数场景                更显式,适合复杂场景 *@
@* 默认绑定属性        自动绑定到 value 属性                显式绑定到 value 属性 *@
@* 默认事件            默认绑定到 onchange 事件            需要显式指定事件(如 oninput) *@
@* 适用场景            普通 HTML 元素或简单组件            自定义组件或需要显式控制的场景 *@
@* 灵活性            较低,适合简单绑定                    较高,适合需要精细控制的场景 *@

废话不多说,直接看总结,就是看使用场景是简单还是复杂


如何解决父组件,子组件的参数传递
级联访问指令
1. 可以按照“名字”进行索引,这个CascadingValue范围内的对象都可以通过“级联访问名索引”
需要多个不同的级联索引,就套娃多写几层
在父组件
<CascadingValue Value="@C#区域变量名" Name="级联访问识别名">
    @* 希望进行级联索引的子组件 *@
</CascadingValue>
在子组件的C#区域,通过[CascadingParameter(Name = "级联访问识别名")]来提取父组件传递进来的信息,然后再通过@标记传到子组件的前端区域

2. 可以按照类型进行索引,也是类似于名字索引
在父组件
<CascadingValue Value="@C#区域变量名" >
    @* 希望进行级联索引的子组件 *@
</CascadingValue>
其实就是不用写那个Name了,框架自动根据C#变量区域的类型推断,方便不用名字
在子组件的C#区域[CascadingParameter]提取就完了,省事

3. 级联传递时的值覆写问题
框架在按照名字进行索引的时候,会出现级联传递的名字一样的情况,这种情况下就会发生在传递过程中的覆写问题,框架并不禁止这种行为,可以在过程中组件将上一级传递的值修改,然后再往下传递。
 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

web实操9——session

概念 数据保存在服务器HttpSession对象里。 session也是域对象&#xff0c;有setAttribute和getAttribute方法 快速入门 代码 获取session和塞入数据&#xff1a; 获取session获取数据&#xff1a; 请求存储&#xff1a; 请求获取&#xff1a; 数据正常打印&#xff1a…

如何在电脑上使用 FaceTime

如今&#xff0c;视频通话已成为与朋友、家人和同事保持联系的重要组成部分。 FaceTime 是 Apple 推出的一款功能丰富的视频通话应用程序。它以其简单性和视频质量而闻名。但如果您想在 PC 上使用 FaceTime该怎么办&#xff1f;虽然 FaceTime 仅适用于 Apple 设备&#xff0c;但…

(框架漏洞)

1.Thinkphp 1.Thinkphp5x远程命令执⾏及getshell 搭建靶场环境 vulhub/thinkphp/5-rce docker-compose up -d #启动环境 ?sindex/think\app/invokefunction&functioncall_user_func_array&vars[0]system&vars[1][]whoami ?s/Index/\think\app/invokefunctio…

探秘Kafka源码:关键内容解析

文章目录 一、以kafka-3.0.0为例1.1安装 gradle 二、生产者源码2.1源码主流程图2.2 初始化2.3生产者sender线程初始化2.4 程序入口2.5生产者 main 线程初始化2.6 跳转到 KafkaProducer构造方法 一、以kafka-3.0.0为例 打开 IDEA&#xff0c;点击 File->Open…->源码包解…

动态库dll与静态库lib编程4:MFC规则DLL讲解

文章目录 前言一、说明二、具体实现2.1新建项目2.2 模块切换的演示 总结 前言 动态库dll与静态库lib编程4&#xff1a;MFC规则DLL讲解。 一、说明 1.前面介绍的均为Win32DLL&#xff0c;即不使用MFC的DLL。 2.MFC规则DLL的特点&#xff1a;DLL内部可以使用MFC类库、可以被其他…

对比学习损失函数 - InfoNCE

InfoNCE Loss &#xff1a;构建高效对比学习模型 引言 对比学习中的InfoNCE损失函数是自监督学习领域的重要进展&#xff0c;它通过最大化正样本对之间的相似度并最小化负样本对的相似度&#xff0c;有效地引导模型学习到数据的本质特征。InfoNCE不仅提高了表示学习的质量&am…

家用万兆网络实践:紧凑型家用服务器静音化改造(二)

大家好&#xff0c;这篇文章我们继续分享家里网络设备的万兆升级和静音改造经验&#xff0c;希望对有类似需求的朋友有所帮助。 写在前面 在上一篇《家用网络升级实践&#xff1a;低成本实现局部万兆&#xff08;一&#xff09;》中&#xff0c;我们留下了一些待解决的问题。…

【STC库函数】Compare比较器的使用

如果我们需要比较两个点的电压&#xff0c;当A点高于B点的时候我们做一个操作&#xff0c;当B点高于A点的时候做另一个操作。 我们除了加一个运放或者比较器&#xff0c;还可以直接使用STC内部的一个比较器。 正极输入端可以是P37、P50、P51&#xff0c;或者从ADC的十六个通道…

东京大学联合Adobe提出基于指令的图像编辑模型InstructMove,可通过观察视频中的动作来实现基于指令的图像编辑。

东京大学联合Adobe提出的InstructMove是一种基于指令的图像编辑模型&#xff0c;使用多模态 LLM 生成的指令对视频中的帧对进行训练。该模型擅长非刚性编辑&#xff0c;例如调整主体姿势、表情和改变视点&#xff0c;同时保持内容一致性。此外&#xff0c;该方法通过集成蒙版、…

海思Linux(一)-Hi3516CV610的开发-ubuntu22_04环境创建

目 录 前 言 一、芯片介绍 二、环境搭建 2.1 前提准备 2.2 虚拟机创建 2.3 ubuntu环境安装 2.4 基础ubuntu环境搭建 2.5 使用MobaXterm登陆ubuntu 前 言 芯片选型:HI3516CV610 选择的开发板是&#xff1a;酷电科技馆的Hi3516CV610-MINI开发板 上一篇文章&#xf…

vue elementUI Plus实现拖拽流程图,不引入插件,纯手写实现。

vue elementUI Plus实现拖拽流程图&#xff0c;不引入插件&#xff0c;纯手写实现。 1.设计思路&#xff1a;2.设计细节3.详细代码实现 1.设计思路&#xff1a; 左侧button列表是要拖拽的组件。中间是拖拽后的流程图。右侧是拖拽后的数据列表。 我们拖动左侧组件放入中间的流…

Spring boot 项目 Spring 注入 代理 并支持 代理对象使用 @Autowired 去调用其他服务

文章目录 类定义与依赖注入方法解析createCglibProxy注意事项setApplicationContext 方法createCglibProxy 方法 类定义与依赖注入 Service: 标识这是一个 Spring 管理的服务类。ApplicationContextAware: 实现该接口允许你在类中获取 ApplicationContext 对象&#xff0c;从而…

应用程序越权漏洞安全测试总结体会

应用程序越权漏洞安全测试总结体会 一、 越权漏洞简介 越权漏洞顾名思议超越了自身的权限去访问一些资源&#xff0c;在OWASP TOP10 2021中归类为A01&#xff1a;Broken Access Control&#xff0c;其本质原因为对访问用户的权限未进行校验或者校验不严谨。在一个特定的系统或…

JAVA:Spring Boot 集成 Quartz 实现分布式任务的技术指南

1、简述 Quartz 是一个强大的任务调度框架&#xff0c;允许开发者在应用程序中定义和执行定时任务。在 Spring Boot 中集成 Quartz&#xff0c;可以轻松实现任务的调度、管理、暂停和恢复等功能。在分布式系统中&#xff0c;Quartz 也支持集群化的任务调度&#xff0c;确保任务…

改善 Kibana 中的 ES|QL 编辑器体验

作者&#xff1a;来自 Elastic Marco Liberati 随着新的 ES|QL 语言正式发布&#xff0c;Kibana 中开发了一种新的编辑器体验&#xff0c;以帮助用户编写更快、更好的查询。实时验证、改进的自动完成和快速修复等功能将简化 ES|QL 体验。 我们将介绍改进 Kibana 中 ES|QL 编辑器…

【深度学习入门_基础篇】线性代数本质

开坑本部分主要为基础知识复习&#xff0c;新开坑中&#xff0c;学习记录自用。 学习目标&#xff1a; 熟悉向量、线性组合、线性变换、基变换、矩阵运算、逆函数、秩、列空间、零空间、范式、特征指、特征向量等含义与应用。 强烈推荐此视频&#xff1a; 【官方双语/合集】…

【SpringBoot】当 @PathVariable 遇到 /,如何处理

1. 问题复现 在解析一个 URL 时&#xff0c;我们经常会使用 PathVariable 这个注解。例如我们会经常见到如下风格的代码&#xff1a; RestController Slf4j public class HelloWorldController {RequestMapping(path "/hi1/{name}", method RequestMethod.GET)publ…

VBA(Visual Basic for Applications)编程|excel|一系列网址或文件路径快速转换为可点击的超链接

很多时候&#xff0c;我们需要把导入的数据某一列转换成超链接&#xff0c;比如URL形式的列。 那么&#xff0c;大批量的情况下&#xff0c;无疑一个个手动点击是非常愚蠢的办法&#xff0c;这个时候我们就需要VBA编程来编写宏&#xff0c;通过编写宏来简化这些手动操作并不现…

小程序开发全解析 快速构建高效应用的核心指南

内容概要 小程序开发是当前数字世界中炙手可热的领域&#xff0c;吸引了无数开发者和企业的关注。随着技术的进步&#xff0c;小程序成为了提升用户体验、增强品牌曝光以及增加客户互动的重要工具。了解小程序的基本概念&#xff0c;就像是打开了一扇通往新世界的大门。 在这…

SQL—Group_Concat函数用法详解

SQL—Group_Concat函数用法详解 在LC遇见的一道很有趣的SQL题&#xff0c;有用到这个函数&#xff0c;就借这道题抛砖引玉&#xff0c;在此讲解一下group_concat函数的用法。&#x1f923; GROUP_CONCAT([DISTINCT] expression [ORDER BY expression] [SEPARATOR separator])…