首先,我们在安装scratch3。0后,浏览器默认打开的是编程的页面。如下图:

那么我们希望开发一个功能,就是打开的时候默认加入某一个SB3的开发文件

1.首先,我们需要有一个.SB3的开发文件,建议上传到STATIC目录下

2、找到scratch-gui-develop>src>container》gui.jsx文件

找到44行的componentDidMount函数

  新增以下代码

 
        const url="/static/123.sb3";
        fetch(url,{
            method: 'GET'
        })
        .then(response=>response.blob())
        .then(blob=>{
            const reader=new FileReader();
            reader.onload=()=>this.props.vm.loadProject(reader.result)
            .then(()=>{
                GoogleAnalytics.event({
                    category:'project',
                    action:'Import Project File',
                    nonInteraction:true
                })
            })
            reader.readAsArrayBuffer(blob)
        })
        .catch(error=>{
            alert(`远程加载文件错误!${error}`)
        })

文件加载完毕

此外,我们例如希望开发像修改作业之类的,我们可以需要进行文件的传递

我们需要将上面的第一行

 const url="/static/123.sb3";

更改为

 const url=window.projecturl;

然后呢。在首页,例如paly.html添加上以上代码,或者自己用参数来传递

<script>

window.projectUrl="https://steam.nosdn.127.net/885318eb-ad83-44c4-afe3-d3bea0a0d2ab.sb3";

</script>

--------------------------------------------------------------------

博主:雷君(微软MVP,众聚互联CEO)

长期致力于企业IT服务,以及青少年编程培训课程

培训机构讨论热线:18859773999

--------------------------------------------------------------------

如何自动加载scratch3.0的页面上实现自动加载原有的作品的更多相关文章

  1. 使用JavaScript实现在页面上所有内容加载完之前一直显示loading...页面

    Html <body class="is-loading"> <div class="curtain"> <div class=& ...

  2. 一段实现页面上的图片延时加载的js

    大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较 ...

  3. Scratch3.0设计的插件系统(上篇)

    我们每个人在内心深处都怀有一个梦想: 希望创造出一个鲜活的世界,一个宇宙.处在我们生活的中间.被训练为架构师的那些人,拥有这样的渴望: 在某一天,在某一个地方,因为某种原因,创造出了一个不可思议的.美 ...

  4. 微信小程序 - 为何setData到页面上有的加分号

    Page({ /** * 页面的初始数据 */ data: { }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { let _page = t ...

  5. python3 操作页面上各种元素的方法

    (1)       控制浏览器 ①控制浏览器窗口大小set_window_size(宽,高) 打开浏览器全屏maximize_window() ②控制浏览器后退back().前进forward() ③ ...

  6. 页面滚动动态加载数据,页面下拉自动加载内容 jquery

    <!DOCTYPE=html> <html> <head> < script src="js/jquery.js" type=" ...

  7. jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法

    博客分类: jquery-easyui jQueryAjax框架HTML  现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...

  8. Jquery页面滚动动态加载数据,页面下拉自动加载内容

    <!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...

  9. 前端 | 页面触底自动加载 Vue 组件

    不管是 web 端还是移动端,信息流都是现在很流行的信息展示方式.信息流经常搭配自动加载一起使用以获得更好的使用体验. 最近在使用 Vue 开发过程中也遇到了首页信息流自动加载的需求.大致了解了一下几 ...

随机推荐

  1. Docker 运行ES和Kibana

    1. docker pull image docker pull elasticsearch:6.7.2 docker pull mobz/elasticsearch-head:5 docker pu ...

  2. [ARM-Linux开发]Linux open函数

    Linux open函数 open 函数用于打开和创建文件.以下是 open 函数的简单描述 #include <fcntl.h> int open(const char *pathnam ...

  3. Mysql update多表联合更新

    下面我建两个表,并执行一系列sql语句,仔细观察sql执行后表中数据的变化,很容易就能理解多表联合更新的用法 student表                                      ...

  4. 【记录】【MySQL】拼接字符串函数 CONCAT(str1,str2)

    CONCAT(str1,str2) 就是把str1和str2拼接

  5. Java多线程编程(1)--Java中的线程

    一.程序.进程和线程   程序是一组指令的有序集合,也可以将其通俗地理解为若干行代码.它本身没有任何运行的含义,它只是一个静态的实体,它可能只是一个单纯的文本文件,也有可能是经过编译之后生成的可执行文 ...

  6. checkbox之全选和反选

    先导入jquery组件 <input type="checkbox" id="checkall">全选<input type="ch ...

  7. python_进程池以及线程池

    可以重复利用的线程 直接上代码 from threading import Thread, current_thread from queue import Queue # 重写线程类 class M ...

  8. vue3 createComponent

    这个函数不是必须的,除非你想要完美结合 TypeScript 提供的类型推断来进行项目的开发. 这个函数仅仅提供了类型推断,方便在结合 TypeScript 书写代码时,能为 setup() 中的 p ...

  9. Java核心技术梳理-类加载机制与反射

    一.引言 反射机制是一个非常好用的机制,C#和Java中都有反射,反射机制简单来说就是在程序运行状态时,对于任意一个类,能够知道这个类的所有属性和方法,对于任意一个对象,能够调用它的任意属性和方法,其 ...

  10. DevExpress中GridColumnCollection实现父子表数据绑定

    绑定数据: 父表: DataTable _parent = _dvFlt.ToTable().Copy(); 子表: DataTable _child = _dvLog.ToTable().Copy( ...