asp.net blazor集成TinyMCE.Blazor

asp.net blazor项目添加TinyMCE.Blazor nuget包

在blazor页面中添加,可以通过ScriptSrc参数配置自定义TinyMCE.Blazor js

            <EditForm class="mb-3" Model="Model" OnValidSubmit="@HandleValidSubmit"><div class="form-group"><label class="control-label">内容</label><TinyMCE.Blazor.Editor Field="() => Model.Content"@bind-Value="Model.Content"ScriptSrc="https://zeus-site-www.oss-cn-beijing.aliyuncs.com/tinymce_6.0.2/tinymce/js/tinymce/tinymce.min.js"JsConfSrc="tinymceConf" /></div><div class="form-group"><input type="submit" value="创建" class="btn btn-primary" /><input type="button" value="返回" class="btn btn-secondary" @onclick="(()=> ClickToBack())" /></div></EditForm>
 var BuildTinymceConf = (imgUploadUrl) => {window.tinymceConf = {//selector: 'textarea#tinymce_edit',  // change this value according to your HTMLtheme: 'silver',language: 'zh_CN',language_url: 'https://zeus-site-www.oss-cn-beijing.aliyuncs.com/tinymce4x_languages/langs/zh_CN.js',height: "480",images_upload_url: imgUploadUrl,images_upload_credentials: true,plugins: "code codesample preview searchreplace autolink directionality visualblocks visualchars fullscreen link media template codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help image emoticons",toolbar: "codesample | formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent  | removeformat image emoticons",codesample_languages: [{ text: 'HTML/XML', value: 'markup' },{ text: 'JavaScript', value: 'javascript' },{ text: 'TypeScript', value: 'typescript' },{ text: 'Python', value: 'python' },{ text: 'PowerShell', value: 'powershell' },{ text: 'SQL', value: 'sql' },{ text: 'Git', value: 'git' },{ text: 'CSS', value: 'css' },{ text: 'Bash', value: 'bash' },{ text: 'CSS', value: 'css' },{ text: 'PHP', value: 'php' },{ text: 'Ruby', value: 'ruby' },{ text: 'Python', value: 'python' },{ text: 'Java', value: 'java' },{ text: 'C', value: 'c' },{ text: 'C#', value: 'csharp' },{ text: 'C++', value: 'cpp' }],textcolor_map: ["000000", "Black","993300", "Burnt orange","333300", "Dark olive","003300", "Dark green","003366", "Dark azure","000080", "Navy Blue","333399", "Indigo","333333", "Very dark gray","800000", "Maroon","FF6600", "Orange","808000", "Olive","008000", "Green","008080", "Teal","0000FF", "Blue","666699", "Grayish blue","808080", "Gray","FF0000", "Red","FF9900", "Amber","99CC00", "Yellow green","339966", "Sea green","33CCCC", "Turquoise","3366FF", "Royal blue","800080", "Purple","999999", "Medium gray","FF00FF", "Magenta","FFCC00", "Gold","FFFF00", "Yellow","00FF00", "Lime","00FFFF", "Aqua","00CCFF", "Sky blue","993366", "Red violet","FFFFFF", "White","FF99CC", "Pink","FFCC99", "Peach","FFFF99", "Light yellow","CCFFCC", "Pale green","CCFFFF", "Pale cyan","99CCFF", "Light sky blue","CC99FF", "Plum"]};}

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

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

相关文章

TCP触发海康扫码相机S52CN-IC-JQR-NNN25

PC环境设置 为保证客户端正常运行以及数据传输的稳定性&#xff0c;在使用客户端软件前&#xff0c;需要对 PC 环境 进行设置 关闭防火墙 操作步骤如下&#xff1a; 1. 打开系统防火墙。 2. 在自定义设置界面中&#xff0c;选择关闭防火墙的对应选项&#xff0c;并单击…

关于保留VLAN

1.定义 保留VLAN是作为交换机系统内部控制面通道以及部分特性的用户业务数据的承载通道。 是不是感觉有点晦涩难懂捏&#xff1f; 2.保留VLAN的ID范围 总范围&#xff1a;4064-4094 镜像口功能占用VLAN&#xff1a;4064-4071 后续拓展保留&#xff1a;4072-4094 系统占用…

74hc595模块参考

74hc595模块参考 8位串行并行输出&#xff08;SIPO&#xff09;移位寄存器 使用74HC595移位寄存器扩展微控制器上的输出引脚数量。如果你需要扩充输入引脚的数量那么你需要74HC165移位寄存器。 SER&#xff08;串行输入&#xff09;引脚用于一次一位地将数据发送到移位寄存器…

快速教程|如何在 AWS EC2上使用 Walrus 部署 GitLab

Walrus 是一款基于平台工程理念的开源应用管理平台&#xff0c;致力于解决应用交付领域的深切痛点。借助 Walrus 将云原生的能力和最佳实践扩展到非容器化环境&#xff0c;并支持任意应用形态统一编排部署&#xff0c;降低使用基础设施的复杂度&#xff0c;为研发和运维团队提供…

MyBatis总结

简介 MyBatis是一款持久层框架&#xff0c;是基于JDBC的开发。 基本使用 mybatis配置文件设计标签和顶层结构如下&#xff1a; configuration&#xff08;配置&#xff09; properties&#xff08;属性&#xff09; settings&#xff08;设置&#xff09; typeAliases&…

ChatGPT辅助下的小组学习

1 网上分享会-主题 1.9曾子曰&#xff1a;“慎终追远&#xff0c;民德归厚矣。” Master Zeng said:“Be circumspect in funerary services and continue sacrifices to the distant ancestors, and the virtue (de 德) of the common people will thrive.” 2 过程记录 听…

Solr搜索参数详解

Solr 页面搜索 1.1 基本查询 参数意义q查询的关键字&#xff0c;此参数最为重要&#xff0c;例如&#xff0c;qid:1&#xff0c;默认为q:&#xff0c;fl指定返回哪些字段&#xff0c;用逗号或空格分隔&#xff0c;注意&#xff1a;字段区分大小写&#xff0c;例如&#xff0c;…

459. 重复的子字符串

459. 重复的子字符串 原题链接&#xff1a;完成情况&#xff1a;解题思路&#xff1a;参考代码&#xff1a;__459重复的子字符串_枚举__459重复的子字符串_字符串匹配__459重复的子字符串_KMP算法__459重复的子字符串_优化的KMP算法 错误经验吸取 原题链接&#xff1a; 459. …

酷开科技持续推动智能投影行业创新发展

近年来&#xff0c;投影仪逐渐成为年轻人追捧的家居时尚单品。据国际数据公司&#xff08;IDC&#xff09;报告显示&#xff0c;2022年中国投影机市场总出货量505万台&#xff0c;超80%为家用投影仪。相比于电视&#xff0c;投影仪外观小巧、屏幕大小可调节&#xff0c;无论是卧…

OpenCV:图像旋转与缩放

人工智能的学习之路非常漫长&#xff0c;不少人因为学习路线不对或者学习内容不够专业而举步难行。不过别担心&#xff0c;我为大家整理了一份600多G的学习资源&#xff0c;基本上涵盖了人工智能学习的所有内容。点击下方链接,0元进群领取学习资源,让你的学习之路更加顺畅!记得…

从白日梦到现实:推出 Elastic 的管道查询语言 ES|QL

作者&#xff1a;George Kobar, Bahubali Shetti, Mark Settle 今天&#xff0c;我们很高兴地宣布 Elastic 的新管道查询语言 ES|QL&#xff08;Elasticsearch 查询语言&#xff09;的技术预览版&#xff0c;它可以转换、丰富和简化数据调查。 ES|QL 由新的查询引擎提供支持&am…

Git基础知识学习常用命令一

常用命令 $ git status 工作区域与仓库保持一致step2: 暂存状态 $ git add --all # 当前项目下的所有更改 $ git add . # 当前目录下的所有更改 $ git add xx/xx.py xx/xx2.py # 添加某几个文件Step3: commit $ git commit -m"<这里写commit的描述>" 已提…

vmware16.2内部win7联网

1、主机配置 前置条件&#xff1a;DHCP和NAT服务已启动 设置无线IP与虚拟机IP为自动获取 二者都是&#xff1a;右键-属性 选择IPv4 自动获取 2、虚拟机配置 设置虚拟机上网方式为NAT 菜单栏-虚拟机-设置 NMnet8改为NAT模式 菜单栏-编辑-虚拟网络编辑器 win7系统内部网…

android studio离线tips

由于种种原因&#xff08;你懂的&#xff0c;导致我们使用android studio会有很多坑&#xff0c;这里记录一下遇到的问题以及解决方案 环境问题 无法下载gradle 因为android studio采用gradle作为构建工具&#xff0c;国内gradle没有镜像下载非常慢&#xff0c;并且大概率失…

13. 高精度延时

13. 高精度延时 GPT 定时器简介GPT 定时器结构GPT 定时器工作模式 GPT 定时器相关寄存器GPTx_CRGPTx_PRGPTx_SRGPTx_CNTGPTx_OCR GPT 配置步骤程序编写bsp_delay.hbsp_delay.cmain GPT 定时器简介 GPT 定时器是一个 32 位向上定时器&#xff0c;也就是从0x00000000 开始向上递…

大数据开发数据治理方向

模型合规&#xff08;包括了元数据治理&#xff0c;原来只到了元数据层次&#xff09;&#xff1a;1.数据标准重制定及修复&#xff0c;包括对原来数据域重构&#xff0c;表字段命名体系重构&#xff0c;并对原来模型按照新标准合规改造 2.元数据补充 owner、使用说明、字段中文…

【算法与数据结构】93、LeetCode复原 IP 地址

文章目录 一、题目二、解法三、完整代码 所有的LeetCode题解索引&#xff0c;可以看这篇文章——【算法和数据结构】LeetCode题解。 一、题目 二、解法 思路分析&#xff1a;参照【算法与数据结构】131、LeetCode分割回文串的思路&#xff0c;需要将IP字符串进行分割&#xff0…

ChatGPT王炸升级

刚刚出炉的新GPT&#xff0c;可以在公司内部共享或对所有人公开。 从此&#xff0c;“GPT开发者”像“iOS开发者”一样成为了新的职业&#xff0c;让AI替你赚钱的梦想成真了。 与此同时&#xff0c;现有的GPT-4也迎来一大波更新。 新版本GPT-4 Turbo&#xff0c;支持128k上下…

K8S篇之k8s常用操作指令

1、常见kubectl操作指令 // 获取k8s集群node信息 kubectl get nodes // 描述一个node 信息 kubectl desctibe nodes NODE_NAME // 描述所有pod信息 kubectl describe pods // 查看namespace列表 kubectl get namespaces // 创建namespace kubectl create ns 命名空间名称 // 查…

No181.精选前端面试题,享受每天的挑战和学习

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入…