weixin_42644340的博客

定制化openblock-gui（介绍篇）目标OpenBlock定制化openblock-gui章节目录链接:目标接下来将给大家更新关于openblock定制化的相关信息，学完这系列文章你将能实现：1.定制化openblock的Logo2.为你的openblock实现登录功能(前端+后端)OpenBlock由于时间关系该系列文章将不会介绍OpenBlock基础知识。想了解、学习OpenBlock的请前往官方GitHub：OpenBlock 项目地址：https://github.com/op

第一章 openblock-gui定制化Logo前言克隆项目切换分支查看分支切换分支安装项目依赖定制化Logo前言本章将为大家介绍如何去修改openblock-gui的logo，从而实现定制化自己的logo克隆项目//部分人执行此条指令可能没事git clone https://github.com/openblockcc/openblock-gui//如果上面指令报错,则将https替换成git,指令如下//fatal: unable to access 'https://github.c

第二章 openblock-gui实现用户登录 1前言代码编写前言接下来几章将带大家实现实现用户登录。这里要求大家必须掌握redux与react-redux，否则你将看到云里雾里，考虑到部分人可能没有学习过React、redux与react-redux，这里建议这部分人先别往下，前去bilibili学习下React相关知识：尚硅谷2021版React技术全家桶全套完整版（零基础入门到精通/男神天禹老师亲授），学完再继续。代码编写创建一个user-state的reducer，在src->redu

负责国际化的openblock-l10n前言代码编写前言在上一章我们留下了一个报错"Missing message: “gui.menuBar.loginButton” for locale: “zh-cn”, using default message as fallback."对吧，本章我们将解决它。本章我们将修改负责国际化的openblock-l10n。代码编写首先我们来到openblock的官方代码仓库，往下我们会看到一个openblock-l10n 的东西，我们将它克隆到与openbloc

第四章 openblock-gui实现用户登录3（登录弹窗制作）前言代码编写前言我们要制作一个用户登录那么是不是需要一个登录框呢？要不然用户登录个寂寞，所以本章节我将带大家实现登录弹出框。因为openblock已经定义好了它自己的container Modal，所以我们直接使用岂不快哉！代码编写首先写让我们来写个登录窗体的组件吧，前面的章节按钮组件我用了函数组件，那么窗体我们就使用类组件吧。首先在src\components下新建一个login-popup文件夹，在里面新建login-popup.j

openblock-gui实现用户登录3（前端发送请求）前言代码编写前言上一章我们已经实现了登录弹窗了，那有了登录弹窗接下来肯定要获取登录信息开始登录了对吧，那本章我们就一起来实现获取弹窗的输入信息并完成请求发送。代码编写首先呢我们是不是需要先去收集到用户在弹出框内填入的账号和密码对吧，好的那么接下来呢我们便修改下我们之前写的login-popup，需要对input框加入ref属性(如果你还是熟悉ref是什么建议翻到我们的第二张去bilibili先学一学)，然后就是新增一个getAccountAnd

userData共享前言代码实现前言userData共享其实和loginState共享是一样的，说实话都不想把这个作为一章，但是考虑有些萌新，我就再带大家实现一遍，已经掌握的人可以跳过本章自己实现一遍。代码实现首先来到src\containers\gui.jsx，添加如下代码// 大概在129行const mapStateToProps = state => { return { ... userData: state.scratchGui.userState.userDa