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 组件

条码扫描 ZXingBlazor



图片浏览器 Viewer

条码扫描 BarcodeScanner

手写签名 Handwritten

手写签名 SignaturePad

定位/持续定位 Geolocation

屏幕键盘 OnScreenKeyboard

百度地图 BaiduMap

谷歌地图 GoogleMap

蓝牙和打印 Bluetooth

PDF阅读器 PdfReader

文件系统访问 FileSystem

光学字符识别 OCR

电池信息/网络信息 WebAPI

视频播放器 VideoPlayer

文件预览 FileViewer

AlexChow

今日头条 | 博客园 | 知乎 | Gitee | GitHub

Blazor组件自做十四 : Blazor FileViewer 文件预览 组件的更多相关文章

  1. 风炫安全web安全学习第三十四节课 文件包含漏洞防御

    风炫安全web安全学习第三十四节课 文件包含漏洞防御 文件包含防御 在功能设计上不要把文件包含的对应文件放到前台去操作 过滤各种../,https://, http:// 配置php.ini文件 al ...

  2. [js开源组件开发]-手机端照片预览组件

    手机端照片预览组件 可怜的我用着华为3C手机,用别人现成的组件都好卡,为了适应我这种屌丝,于是自己简化写了一版的照片预览效果,暂时无缩放功能,以后可能有空再加吧,你也可以自己加下,这是个github上 ...

  3. 图片预览组件PhotoView

    图片预览组件PhotoView PhotoView是一款图片预览组件,广泛应用于大图的查看.该组件支持图片手势缩放.旋转等功能.它可以很好的和ViewPager.Picasso等组件结合,实现各种复杂 ...

  4. Spring学习(十四)----- Spring Auto Scanning Components —— 自动扫描组件

    一.      Spring Auto Scanning Components —— 自动扫描组件 1.      Declares Components Manually——手动配置componen ...

  5. 移动端Vue图片获取,压缩,预览组件-upload-img(H5+获取照片,压缩,预览)

    组件示例图 组件代码 upload_img.vue <div id="uploadImg"> <div class="upload_image_box& ...

  6. Android笔记(十四) Android中的基本组件——按钮

    Android中的按钮主要包括Button和ImageButton两种,Button继承自TextView,而ImageButton继承自ImageView.Button生成的按钮上显示文字,而Ima ...

  7. scrapy 基础组件专题(十四):scrapy CookiesMiddleware源码

    一 Scrapy框架--cookie的获取/传递/本地保存 1. 完成模拟登陆2. 登陆成功后提取出cookie,然后保存到本地cookie.txt文件中3. 再次使用时从本地的cookie.txt中 ...

  8. 攻城狮在路上(叁)Linux(十四)--- 查阅文件内容

    常用命令:cat.tac.nl.more.less.head.tail.od... 一.直接查看文件内容:cat.tac.nl <==一次性全部读取 1.cat [-AbEnTv] 文件名 参数 ...

  9. [Doctrine Migrations] 数据库迁移组件的深入解析四:集成diff方式迁移组件

    场景及优势 熟悉Symfony框架之后,深刻感受到框架集成的ORM组件Doctrine2的强大之处,其中附带的数据迁移也十分方便.Doctrine2是使用Doctrine DBAL组件把代码里面的表结 ...

  10. Spring Boot2(十四):单文件上传/下载,文件批量上传

    文件上传和下载在项目中经常用到,这里主要学习SpringBoot完成单个文件上传/下载,批量文件上传的场景应用.结合mysql数据库.jpa数据层操作.thymeleaf页面模板. 一.准备 添加ma ...

随机推荐

  1. 前端程序员学习 Golang gin 框架实战笔记之一开始玩 gin

    原文链接 我是一名五六年经验的前端程序员,现在准备学习一下 Golang 的后端框架 gin. 以下是我的学习实战经验,记录下来,供大家参考. https://github.com/gin-gonic ...

  2. KNN算法介绍及源码实现

    一.KNN算法介绍 邻近算法,或者说K最邻近(KNN,K-NearestNeighbor)分类算法是数据挖掘分类技术中最简单的方法之一.所谓K最近邻,就是K个最近的邻居的意思,说的是每个样本都可以用它 ...

  3. python中类与对象的命名空间(静态属性的陷阱)、__dict__ 和 dir() 在继承中使用说明

    1. 面向对象的概念 1)类是一类抽象的事物,对象是一个具体的事物:用类创建对象的过程,称为实例化. 2)类就是一个模子,只知道在这个模子里有什么属性.什么方法,但是不知道这些属性.方法具体是什么: ...

  4. fileinput 的总结

    fileinput组件实战总结 fileinput是一个增强的基于Bootstrap3.x和HTML5的文件上传工具,具备多种格式文件的预览功能, 另外,它包含了基于AJAX的上传,拖拽和撤销文件,可 ...

  5. Vue学习之--------Vue中收集表单数据(使用v-model 实现双向数据绑定、代码实现)(2022/7/18)

    文章目录 1.Vue中实现表单数据的收集 1.1 基础知识 1.2 代码实例 1.3 测试效果 1.4 额外插一嘴 1.Vue中实现表单数据的收集 1.1 基础知识 表单中常用的标签:input(输入 ...

  6. 40.TokenAuthentication认证

    TokenAuthentication认证介绍 TokenAuthentication是一种简单的基于令牌的HTTP认证 适用于CS架构,例如普通的桌面应用程序或移动客户端   TokenAuthen ...

  7. 1.Python面向对象基础

    面向对象(OOP) 面向对象编程--object oriented programming 简写 OOP   面向过程和面向对象的区别: 面向过程: 1.把完成某一个需求的所有步骤从头到尾逐步实现 2 ...

  8. Elasticsearch rest-high-level-client 基本操作

    Elasticsearch rest-high-level-client 基本操作 本篇主要讲解一下 rest-high-level-client 去操作 Elasticsearch , 虽然这个客户 ...

  9. .NET性能系列文章二:Newtonsoft.Json vs. System.Text.Json

    微软终于追上了? 图片来自 Glenn Carstens-Peters Unsplash 欢迎来到.NET性能系列的另一章.这个系列的特点是对.NET世界中许多不同的主题进行研究.基准和比较.正如标题 ...

  10. 一台虚拟机,基于docker搭建大数据HDP集群

    前言 好多人问我,这种基于大数据平台的xxxx的毕业设计要怎么做.这个可以参考之前写得关于我大数据毕业设计的文章.这篇文章是将对之前的毕设进行优化. 个人觉得可以分为两个部分.第一个部分就是基础的平台 ...