Blazor组件自做十四 : Blazor FileViewer 文件预览 组件
Blazor FileViewer 文件预览 组件
目前支支持 Excel(.docx) 和 Word(.xlsx) 格式
示例:
https://www.blazor.zone/fileViewers
https://blazor.app1.es/fileViewers

使用方法:
1.nuget包
BootstrapBlazor.FileViewer
2._Imports.razor 文件 或者页面添加 添加组件库引用
@using BootstrapBlazor.Components
3.razor页面
<FileViewer Filename="c:/DemoShared/sample.xlsx" />
<FileViewer Filename="c:/DemoShared/sample.docx" />
<FileViewer Filename="https://localhost:5011/_content/DemoShared/sample.xlsx" />
<FileViewer Filename="https://localhost:5011/_content/DemoShared/sample.docx" />
<FileViewer @ref="fileViewer" Filename=@Url />
@code{
private string Url { get; set; } = ("c:/sample.docx");
private async Task Apply()
{
await fileViewer.Reload(Url);
}
}
4.参数说明
| 参数 | 说明 | 默认值 |
|---|---|---|
| Filename | Excel/Word 文件路径或者URL | |
| Width | 宽度 | 100% |
| Height | 高度 | 700px |
| StyleString | 组件外观 Css Style | |
| Html | 设置 Html 直接渲染 | |
| Stream | 用于渲染的文件流,为空则用Filename参数读取文件 | null |
| IsExcel | 文件流模式需要指定是否 Excel. 默认为 false | |
| Reload(string filename) | 重新载入文件方法 | |
| Refresh() | 刷新方法 |
Blazor 组件
AlexChow
今日头条 | 博客园 | 知乎 | Gitee | GitHub
Blazor组件自做十四 : Blazor FileViewer 文件预览 组件的更多相关文章
- 风炫安全web安全学习第三十四节课 文件包含漏洞防御
风炫安全web安全学习第三十四节课 文件包含漏洞防御 文件包含防御 在功能设计上不要把文件包含的对应文件放到前台去操作 过滤各种../,https://, http:// 配置php.ini文件 al ...
- [js开源组件开发]-手机端照片预览组件
手机端照片预览组件 可怜的我用着华为3C手机,用别人现成的组件都好卡,为了适应我这种屌丝,于是自己简化写了一版的照片预览效果,暂时无缩放功能,以后可能有空再加吧,你也可以自己加下,这是个github上 ...
- 图片预览组件PhotoView
图片预览组件PhotoView PhotoView是一款图片预览组件,广泛应用于大图的查看.该组件支持图片手势缩放.旋转等功能.它可以很好的和ViewPager.Picasso等组件结合,实现各种复杂 ...
- Spring学习(十四)----- Spring Auto Scanning Components —— 自动扫描组件
一. Spring Auto Scanning Components —— 自动扫描组件 1. Declares Components Manually——手动配置componen ...
- 移动端Vue图片获取,压缩,预览组件-upload-img(H5+获取照片,压缩,预览)
组件示例图 组件代码 upload_img.vue <div id="uploadImg"> <div class="upload_image_box& ...
- Android笔记(十四) Android中的基本组件——按钮
Android中的按钮主要包括Button和ImageButton两种,Button继承自TextView,而ImageButton继承自ImageView.Button生成的按钮上显示文字,而Ima ...
- scrapy 基础组件专题(十四):scrapy CookiesMiddleware源码
一 Scrapy框架--cookie的获取/传递/本地保存 1. 完成模拟登陆2. 登陆成功后提取出cookie,然后保存到本地cookie.txt文件中3. 再次使用时从本地的cookie.txt中 ...
- 攻城狮在路上(叁)Linux(十四)--- 查阅文件内容
常用命令:cat.tac.nl.more.less.head.tail.od... 一.直接查看文件内容:cat.tac.nl <==一次性全部读取 1.cat [-AbEnTv] 文件名 参数 ...
- [Doctrine Migrations] 数据库迁移组件的深入解析四:集成diff方式迁移组件
场景及优势 熟悉Symfony框架之后,深刻感受到框架集成的ORM组件Doctrine2的强大之处,其中附带的数据迁移也十分方便.Doctrine2是使用Doctrine DBAL组件把代码里面的表结 ...
- Spring Boot2(十四):单文件上传/下载,文件批量上传
文件上传和下载在项目中经常用到,这里主要学习SpringBoot完成单个文件上传/下载,批量文件上传的场景应用.结合mysql数据库.jpa数据层操作.thymeleaf页面模板. 一.准备 添加ma ...
随机推荐
- 前端程序员学习 Golang gin 框架实战笔记之一开始玩 gin
原文链接 我是一名五六年经验的前端程序员,现在准备学习一下 Golang 的后端框架 gin. 以下是我的学习实战经验,记录下来,供大家参考. https://github.com/gin-gonic ...
- KNN算法介绍及源码实现
一.KNN算法介绍 邻近算法,或者说K最邻近(KNN,K-NearestNeighbor)分类算法是数据挖掘分类技术中最简单的方法之一.所谓K最近邻,就是K个最近的邻居的意思,说的是每个样本都可以用它 ...
- python中类与对象的命名空间(静态属性的陷阱)、__dict__ 和 dir() 在继承中使用说明
1. 面向对象的概念 1)类是一类抽象的事物,对象是一个具体的事物:用类创建对象的过程,称为实例化. 2)类就是一个模子,只知道在这个模子里有什么属性.什么方法,但是不知道这些属性.方法具体是什么: ...
- fileinput 的总结
fileinput组件实战总结 fileinput是一个增强的基于Bootstrap3.x和HTML5的文件上传工具,具备多种格式文件的预览功能, 另外,它包含了基于AJAX的上传,拖拽和撤销文件,可 ...
- Vue学习之--------Vue中收集表单数据(使用v-model 实现双向数据绑定、代码实现)(2022/7/18)
文章目录 1.Vue中实现表单数据的收集 1.1 基础知识 1.2 代码实例 1.3 测试效果 1.4 额外插一嘴 1.Vue中实现表单数据的收集 1.1 基础知识 表单中常用的标签:input(输入 ...
- 40.TokenAuthentication认证
TokenAuthentication认证介绍 TokenAuthentication是一种简单的基于令牌的HTTP认证 适用于CS架构,例如普通的桌面应用程序或移动客户端 TokenAuthen ...
- 1.Python面向对象基础
面向对象(OOP) 面向对象编程--object oriented programming 简写 OOP 面向过程和面向对象的区别: 面向过程: 1.把完成某一个需求的所有步骤从头到尾逐步实现 2 ...
- Elasticsearch rest-high-level-client 基本操作
Elasticsearch rest-high-level-client 基本操作 本篇主要讲解一下 rest-high-level-client 去操作 Elasticsearch , 虽然这个客户 ...
- .NET性能系列文章二:Newtonsoft.Json vs. System.Text.Json
微软终于追上了? 图片来自 Glenn Carstens-Peters Unsplash 欢迎来到.NET性能系列的另一章.这个系列的特点是对.NET世界中许多不同的主题进行研究.基准和比较.正如标题 ...
- 一台虚拟机,基于docker搭建大数据HDP集群
前言 好多人问我,这种基于大数据平台的xxxx的毕业设计要怎么做.这个可以参考之前写得关于我大数据毕业设计的文章.这篇文章是将对之前的毕设进行优化. 个人觉得可以分为两个部分.第一个部分就是基础的平台 ...