首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何使用 Blazor 框架在前端浏览器中导入和导出 Excel

在本教程中,我们将使用 Visual Studio 2022 和 SpreadJS V16.0。...SpreadJS 创建 Blazor 应用程序 现在我们已经使用 SpreadJS 创建了一个组件,我们可以在 Blazor 应用程序中使用它。...首先,我们可以使用“Blazor WebAssemblyApp”模板添加一个新项目: 要添加 SpreadJS 组件,我们需要在解决方案资源管理器中右键单击这个新项目的依赖项,然后单击“添加项目引用”...实现类似于基本的 SpreadJS Blazor 代码,但我们需要编辑 Index.razor 文件以添加一些用于设置值和打开 Excel 文件的代码: @page "/" @using SpreadJS_Blazor_Lib...() { JSRuntime.InvokeVoidAsync("sjsAdaptor.saveExcel", host); } (....) } 此文章展示了如何在

36920
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    别了,JavaScript;你好,Blazor

    这允许你在同一个应用中利用WebAssembly的性能和威力以及JavaScript的表达力和灵活性,即使你可能并不知道如何编写WebAssembly代码。...经过了3年时间的开发,2020年5月19日在微软年度技术大会Build上正式发布,我们来看一看Blazor将如何改变Web开发。 Blazor是什么?...Blazor 允许您使用 C# 而不是 JavaScript 构建交互式 Web UI。 Blazor 应用由使用 C#、HTML 和 CSS 实现的可重用 Web UI 组件组成。...在 Blazor WebAssembly 应用程序中构建的文件将编译并发送到浏览器。然后,浏览器在浏览器的执行沙盒中运行您的 JavaScript、HTML 和 C#。...一些缺点: 首次需要下载 .NET 框架和其他运行时文件(一次) 您仅限于浏览器的功能 在本地下载的所有机密(凭据、API 密钥等) 并非兼容所有 .NET 框架组件 有这些缺点也正是Blazor

    3.1K30

    .NET周刊【9月第4期 2024-09-22】

    WPF项目使用Prism框架,通过NLog库将日志发送到LogViewer。配置nlog.config文件并设置依赖注入,以接收和显示不同级别的日志信息。开发者可以实时查看程序运行状态。...让我们开始使用 Semantic Kernel 的多代理 AI 功能第 3 部分 以 PEM 格式保存和加载 RSA 密钥对,使用 C# 加密和解密消息 [.NET 7 及更高版本支持] - Qiita...https://qiita.com/SoundOrion/items/6d4da8b6cce6b52e318d 如何使用 .NET 7 及更高版本支持的 PEM 格式 RSA 密钥加密和解密消息。...Core 应用程序时如何使用 1Password 管理、检索和执行环境变量。.../blazor-hybrid-workshop:全天研讨会(.NET MAUI Blazor Hybrid Workshop in a Box),介绍如何使用 .NET MAUI 为 iOS、Android

    8210

    WPF混合Blazor做个简易聊天小程序

    使用技术栈: .NET 7[1] Prism 8[2] Masa Blazor[3] 搭建WPF+Blazor程序 学习WPF + Blazor混合开发的Hello World最好的地方是微软文档: https...view=aspnetcore-7.0 效果 UI使用了Masa Blazor,效果个人感觉不错,如果用WPF实现,要麻烦不少,以下是几个效果截图: 用户列表窗口 使用了Masa Blazor的列表组件...,代码几乎是直接Copy过来的,参考链接Masa Blazor列表[4]: 用户列表 聊天窗口 这个简单,左侧是一个列表,同上面的用户列表类似,只是去掉了上方蓝色的MToolbar和用户的详细描述信息...聊天窗口 打开子窗口 列表的点击事件,使用IEventAggregator发送打开子窗体事件 OpenUserDialogEvent,事件订阅方法执行弹出子窗体操作: 打开窗口 演示发送消息 发送消息按钮点击...,使用IEventAggregator 发送发送消息事件SendMessageEvent,事件订阅方法接收消息,并追加到各自历史聊天多行文本框展示: 演示发送消息 源码 Github:https:/

    1.7K30

    ASP.NET Core 各版本特性简单整理

    使用 ASP.NET Core,您可以: 生成 Web 应用和服务、物联网 (IoT)应用和移动后端。 在 Windows、macOS 和 Linux 上使用喜爱的开发工具。 部署到云或本地。...Redis 存储数据保护密钥存储库 适用于 Windows 的 WebListener 服务器(注:指 HTTP.sys 服务器) WebSockets 支持 v2.0 Release Time:2017.8.14...和 SignalR 默认使用 System.Text.Json 来进行序列化 ASP.NET Core 中默认不再使用 WebHostBuilder ,而是使用 HostBuilder(可以更好地将...减少跨框架的分配,包括中间件方案和路由。 降低了 WebSocket 连接的内存使用量。 减少 HTTPS 连接的内存使用量并提高了其吞吐量。 新的优化和完全异步 JSON 序列化程序。...有关详细信息,请参阅标头表大小和 HPACK:HTTP/2 的静默杀手锏。 发送 HTTP/2 PING 帧:HTTP/2 有一种机制,用于发送 PING 帧以确保空闲连接仍然正常工作。

    3.4K20

    GitHub 的 Action 如何禁用

    我 Fork 了小伙伴的 ant-design-blazor 仓库,这个仓库设置了每天自动同步样式,这个 Action 用到了源仓库的密钥,在我 Fork 的仓库一定跑不通过,于是每天我就收到一次构建不通过的信息...本文告诉大家如何禁用自己 Fork 的某个仓库的 Action 的执行 这是我 Fork 的 ant-design-blazor仓库,每天都告诉我构建失败 解决方法是禁用这个 Fork 仓库的 Action...也就是我的仓库的 Action 其实没啥用 点击仓库的设置,进入 Actions 页面,点击禁用 如果我表示不让所有 Fork 我的仓库的小伙伴都需要做这个设置,我想要让我的代码仅仅只是在我的仓库运行,可以如何做...github.repository == 'lindexi/doubi' 上面代码设置了只有在 lindexi 的 doubi 仓库才进行构建 如果不是干掉某个步骤,而是需要让整个 job 都不执行,可以在 job 下面使用

    2.5K10

    集成Ids4,实现统一授权认证

    ,这里我我们再来一个前情回顾: 《我的『MVP.Blazor』快速创建与部署》 在这篇文章中,我们简单的了解了下,什么的Blazor,他能做些什么,以及如何快速的入门和部署,属于一个认知的阶段,熟话说万事开头难...] 动态路由与钩子函数》 之前三篇文章,我们学会了组件通信、数据请求、数据绑定和继承等知识点,那这篇文章我简单的对路由和钩子函数做了说明和讲解,已经算是比较完善的项目了; 《如何给Blazor.Server...这里先说明一下,因为毕竟是集成Ids4,涉及的知识会比较多,比如如何使用oidc-client、如何c#调用js事件、如何封装service模块,不过本文就不过多的对这几个知识点讲解原理了,先列出来操作步骤和代码...涉及到的页面和模块 (蓝色背景的三个文件) 1、先在认证中心配置Client 我们既然要集成认证平台,那肯定要去认证中心,配置一个客户端,因为我们的Blazor是一个前端的框架,所以我们使用implicit...3、C#调用js方法模块 是不是如果你看到这个逻辑都很怪异,我们都知道c#和js完全就不是一个逻辑,那是如何相互调用的呢,不仅c#可以使用js方法,我们也同样能在js里去调用c#代码,当然这是在Blazor

    2.1K20

    创建 SpreadJS Blazor 组件

    要使用 Finnhub Stock API,您需要创建一个免费帐户并生成您的 API 密钥,我们稍后将在该应用程序中使用该密钥。...在本教程中,我们将使用 Node.JS Express 和 WebSocket,因此请确保安装最新版本。...在此文中,我们将介绍如何按照以下步骤将实时数据合并到 JavaScript 电子表格中: 设置应用程序 连接到数据源 使用 SpreadJS 中的数据 为折线图添加数据 添加折线图 运行程序 应用设置...Express 作为 Web 框架和 WebSockets 来获取实时数据,我们可以简单地使用 npm 安装它,也将使用它来安装 SpreadJS 文件。...通过 使用 SpreadJS Designer,我们可以为数据源创建数据标签和绑定、格式化单元格、删除网格线和标题,并为图表添加一个区域。

    2K20

    Blazor资源大全,很棒的Blazor(2)

    该工具集还包括查询工具,用于发出复杂的本地或远程查询,更改跟踪工具,将仅更改的记录发送到服务器,高级验证属性,全球化工具,修改现有组件的“行为”,状态管理和保存等等。...使用AAD保护Blazor和Web API - 2022年7月11日 - 本视频展示了如何使用Azure Active Directory (AAD)保护您的Blazor应用程序和Web API。...您将学习基础知识,包括如何使用XAML构建用户界面,如何使用MVVM和数据绑定简化开发,如何在页面之间导航,访问平台功能(如地理位置),优化数据集合,并为浅色和深色主题设置应用程序主题。...这样,我们可以在我们的网站内直接向客户展示我们的自定义报告,而不是将他们发送到单独的应用程序中。...Blazor WebAssembly:在浏览器中使用EF Core和SQLite的强大功能 - 2022年4月12日 - 预览如何在浏览器中使用Blazor WebAssembly使用SQLite和EF

    83520

    快速了解 ASP.NET Core Blazor

    是这个理,但如果等你的公司(国内使用了.NET 技术的公司)都开始使用 Blazor 了,Blazor 还能算是新技术吗?...Blazor 应用可以使用 C#、HTML 和 CSS 实现可重用 Web UI 组件,客户端和服务器代码都用 C# 编写的,允许你共享代码和库。...Blazor 可以使用 WebAssembly 直接在浏览器中运行客户端 C# 代码,正因为它是运行在 WebAssembly 上的 .NET 程序,所以客户端也可以重用服务器端的代码和库。...客户端 UI 事件使用实时消息框架 SignalR 发送回服务器,一旦执行完成,所需的 UI 更改将发送到客户端渲染到 DOM 中。...Blazor 的生态也正逐步发展起来了,虽然还没有听说哪个大公司在用,但 Blazor 的理念是未来趋势,值得你花点时间了解和研究一下。

    1.6K10

    .NET周刊【7月第3期 2023-07-16】

    其中,Redis的散列(Hash)结构是一个常用的结构,今天跟大家分享一个我的日常操作,如何使用Redis的散列(Hash)结构来缓存和查询对象的属性值,以及如何用Lambda表达式树来简化这个过程。...Blazor是一个使用C#/Razor和HTML在浏览器中运行的.NET Web框架。 欢迎贡献!请先查看贡献指南。感谢所有的贡献者,你们真棒,没有你们就不可能实现这个!...此版本添加了对 IHttpModule 的支持和模拟,包括 ASP.NET Core 中的 HttpApplication、自定义会话密钥序列化程序、IHtmlString 支持和其他 API。...-4b29 如何使用 Blazor 中的屏幕唤醒锁定 API 防止屏幕休眠。...本文展示了如何使用 MartinCostello.Logging.XUnit 包。

    23340

    【炫丽】从0开始做一个WPF+Blazor对话小程序

    本文演示如何在WPF中使用Blazor开发漂亮的UI,为客户端开发注入新活力。...本小节源码在这Razor组件实现窗体标题栏功能3.4 Blazor与WPF比较完美的实现效果其实上面的代码可以当做学习,即使有不小瑕疵(哈哈),本小节我们还是使用第三包解决窗体圆角和最大化问题。...,使用该库后也解决了:本小节源码在这解决圆角和最大化问题,下面开始本文的下半部分了,好累,终于到这了。4. 添加第三方Blazor组件工欲善其事,必先利其器!...本文使用Masa Blazor做示例展示,如今Blazor组件库众多,选择自己喜欢的、顺手的就成:站长前些日子介绍过MAUI使用Masa blazor组件库一文,本小节思路也是类似,且看我表演。...上面的代码把子窗体消息回应也贴上了,即点击安卓图标按钮时发送了ReceivedResponseMessage消息,在主窗体RazorViews\MainView.razor里也订阅了这个消息,和上面的代码类似

    8.2K60

    通过 Serverless 加速 Blazor WebAssembly | 社区精选文章

    Blazor WebAssembly 可以让开发者使用跟熟悉的 Razor 模版同样的开发模型,来开发基于 WebAssembly 的 SPA 应用。...Serverless 简介 Serverless 是开发者和企业用户共同推动的,它可以使开发者在构建和运行应用时无需管理服务器等基础设施,将构建应用的成本进一步降低,函数是部署和运行的基本单位。...在 Windows 系统上,如果报错,错误提示是因为在此系统上禁止运行脚本,那么请执行命令开启 .ps1 脚本。...---- 拥有多年互联网金融行业CQRS架构实践经验,热衷于学习和探讨企业应用架构设计和领域驱动设计。热爱开源项目贡献和技术社区分享。...具体免费详情可查阅: https://cloud.tencent.com/document/product/1154/38792 立即使用 Serverless,只需三步 ?

    2.8K51

    【炫丽】从0开始做一个WPF+Blazor对话小程序

    本文演示如何在WPF[1]中使用Blazor[2]开发漂亮的UI,为客户端开发注入新活力。...本小节源码在这Razor组件实现窗体标题栏功能[13] 3.4 Blazor与WPF比较完美的实现效果 其实上面的代码可以当做学习,即使有不小瑕疵(哈哈),本小节我们还是使用第三包解决窗体圆角和最大化问题...,使用该库后也解决了: 窗体手动改变大小 本小节源码在这解决圆角和最大化问题[15],下面开始本文的下半部分了,好累,终于到这了。 我累了 4....本文使用Masa Blazor[18]做示例展示,如今Blazor组件库众多,选择自己喜欢的、顺手的就成: Masa Blazor 站长前些日子介绍过MAUI使用Masa blazor组件库[19]一文...上面的代码把子窗体消息回应也贴上了,即点击安卓图标按钮时发送了ReceivedResponseMessage消息,在主窗体RazorViews\MainView.razor里也订阅了这个消息,和上面的代码类似

    10.4K20

    Blazor WebAssembly 修仙之途 - 初尝

    Blazor 是一个可是使用 .NET/C# 来编写交互式客户端的 Web UI 框架,在官网有一句话概括 “Build client web apps with C#”。...运行时处理从浏览器向服务器发送 UI 事件,并在运行组件后,将服务器发送的 UI 更新并重新应用到浏览器。...Blazor WebAssembly 使用开放的 Web 标准(没有插件或代码转换),适用于移动浏览器等各种新式 Web 浏览器。...Blazor Server 执行业务代码逻辑是通过 SignalR 发送事件到服务端,服务端执行代码,再返回结果,根据返回的数据渲染UI,应用更新,通过下图可以看到。 ?...初体验 1.运行浅析 入口点在 wwwroot/index.html 通过 blazor.webassembly.js 下载 .NET 运行时、应用程序和依赖。

    3.6K10
    领券