how to auto open demo and create it in a new codesandbox

markdown & iframe

https://ant.design/docs/react/getting-started-cn

https://github.com/ant-design/ant-design/blob/master/docs/react/getting-started.zh-CN.md

iframe markdwon

  1. <iframe
<iframe

  src="https://codesandbox.io/embed/antd-reproduction-template-6e93z?autoresize=1&fontsize=14&hidenavigation=1&theme=dark"

  style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;"

  title="antd reproduction template"

  allow="geolocation; microphone; camera; midi; vr; accelerometer; gyroscope; payment; ambient-light-sensor; encrypted-media; usb"

  sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"

/>
  1. &lt;iframe


&lt;iframe

  src="https://codesandbox.io/embed/antd-reproduction-template-6e93z?autoresize=1&fontsize=14&hidenavigation=1&theme=dark"

  style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;"

  title="antd reproduction template"

  allow="geolocation; microphone; camera; midi; vr; accelerometer; gyroscope; payment; ambient-light-sensor; encrypted-media; usb"

  sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"

/&gt;

iframe pre

  1. pre &lt;iframe

<iframe

  src="https://codesandbox.io/embed/antd-reproduction-template-6e93z?autoresize=1&fontsize=14&hidenavigation=1&theme=dark"

  style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;"

  title="antd reproduction template"

  allow="geolocation; microphone; camera; midi; vr; accelerometer; gyroscope; payment; ambient-light-sensor; encrypted-media; usb"

  sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"

/>

docs auto generator

组件文档自动化方案

ci

https://github.com/ant-design/ant-design/blob/master/.codesandbox/ci.json

{

  "sandboxes": ["antd-reproduction-template-6e93z"]

}

https://codesandbox.io/s/antd-reproduction-template-6e93z

https://codesandbox.io/s/antd-reproduction-template-6e93z?from-embed

https://ant.design/docs/react/getting-started

https://ant.design/docs/react/use-in-typescript

cnblogs markdown render order bug

iframe demo must be placed to the last one

  1. <iframe />
  2. <iframe></iframe>

refs

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

how to auto open demo and create it in a new codesandbox的更多相关文章

  1. mdev USB disk auto mount demo

    /********************************************************************* * mdev USB disk auto mount de ...

  2. Oracle Demo ->> CREATE TABLE

    Demo One CREATE TABLE employees_demo ( employee_id ) , first_name ) , last_name ) CONSTRAINT emp_las ...

  3. Spring Auto proxy creator example

    In last Spring AOP examples – advice, pointcut and advisor, you have to manually create a proxy bean ...

  4. 深入理解Auto Layout 第一弹

    本文转载至 http://zhangbuhuai.com/2015/07/16/beginning-auto-layout-part-1/ By 张不坏 2015-07-16 更新日期:2015-07 ...

  5. 【转载】WebStorm安装 & Nodejs-Express Demo

    试试下面这个方法: http://www.sdifenzhou.com/?p=6941 从这里下载 http://pan.baidu.com/share/link?shareid=2512210975 ...

  6. Android P HIDL demo代码编写 （原创）

    之前的文章已经分析了HIDL服务的注册和调用,这篇文章来总结下一个HIDL的服务如何编写. 缩写HAL文件 首先要确认放置文件夹和接口的包名,因为这跟后面使用脚本生成一部分代码有关,一般默认的放在ha ...

  7. Openstack Basic

    html,body { } .CodeMirror { height: auto } .CodeMirror-scroll { } .CodeMirror-lines { padding: 4px 0 ...

  8. MYSQL主键自动增加的配置及auto_increment注意事项

    文章一 原文地址: http://ej38.com/showinfo/mysql-202971.html 文章二:   点击转入第二篇文章 在数据库应用,我们经常要用到唯一编号.在MySQL中可通过字 ...

  9. Oracle建立表空间和用户

    Oracle建立表空间和用户 建立表空间和用户的步骤: 用户 建立:create user 用户名 identified by "密码"; 授权:grant create sess ...

随机推荐

  1. Win2008 server R2重置登录密码Administrator

    1.PE方式修改密码 背景:https://www.cnblogs.com/Crazy-Liu/p/11245730.html 上述连接中的有AD域的机器系统使用哑巴式老毛桃等启动PE出现以下: 原因 ...

  2. MySQL调优之索引优化

    一.索引基本知识 1.索引的优点 1.减少了服务器需要扫描的数据量 2.帮助服务器避免排序和临时表 例子: select * from emp orde by sal desc; 那么执行顺序: 所以 ...

  3. JavaScript基础知识-基本概念

    typeof操作符 typeof 操作符返回一个字符串,表示未经计算的操作数的类型. // 数值 typeof 37 === 'number'; typeof 3.14 === 'number'; t ...

  4. CF912A

    题意 你手里有 A 个黄水晶和 B 个蓝水晶,其中两个黄水晶可以造一个黄水晶球,三个蓝水晶可以造一个蓝水晶球,一黄一蓝两个水晶可以造一个绿水晶球. 现在你需要 x 个黄水晶球,y 个绿水晶球,z 个蓝 ...

  5. JavaWeb——B/S,C/S结构，HTTP协议

    B/S: 开发基于B/S结构项目:目前主要采用三种服务器端语言:JSP,PHP,ASP.NET. 这三种语言构成三种常用应用开发组合:JSP+Oracle组合.PHP+MySQL体系.以及ASP.NE ...

  6. 通过脚本本地下载Jar包

    通过脚本本地下载Jar包 1.脚本 2.pom.xml 1.脚本 download.bat # !/bin/bash mvn -f pom.xml dependency:copy-dependenci ...

  7. ThreadLocal全面解析,一篇带你入门

    ===================== 大厂面试题: 1.Java中的引用类型有哪几种? 2.每种引用类型的特点是什么? 3.每种引用类型的应用场景是什么? 4.ThreadLocal你了解吗 5 ...

  8. 【实战】通过Python实现疫情地图可视化

    目录 一. json模块 二.通过Python实现疫情地图可视化 2.将json格式的数据保存到Excel 3.应用pyecharts进行数据可视化 一. json模块 JSON(JavaScript ...

  9. 【Azure 事件中心】在微软云中国区 (Mooncake) 上实验以Apache Kafka协议方式发送/接受Event Hubs消息 (Java版)

    问题描述 事件中心提供 Kafka 终结点,现有的基于 Kafka 的应用程序可将该终结点用作运行你自己的 Kafka 群集的替代方案. 事件中心可与许多现有 Kafka 应用程序配合使用.在Azur ...

  10. Word 脚本 （自用）

    打开开发工具 右击功能区->自定义功能区 勾选开发工具->确定 导入代码 开发工具选项卡->Visual Basic 右击Normal->插入->模块 粘贴代码-> ...