一直想着能本地化antd的,不用npm以及dva那么复杂的配置环境来开发,并且本地化以后对以后链接flask的模板渲染机制也能很好的结合.下面是具体的实现方法: 1.将react的相关链接引入: <script src="/static/react/react.min.js"></script> <script src="/static/react/react-dom.min.js"></script> <scr

上篇<使用Ant打包Android应用具体解释>描写叙述了使用Ant打包的流程,但非常多步骤并没有说明如此做的原因,本篇将从Ant方面来理解,下一篇从APK生成的流程来说明. APK包的生成是一系列操作的结果,而Ant则是将这一系列操作流程化.提供出定制化的接口,以及可配置的參数供改动,而这些都是通过指定的构建文件来实现. 我们就从Ant的打包流程来理解Ant的一些基本使用方法. 当在命令行中运行ant.默认会去解析当前文件夹的build.xml作为构建文件.以下是个删除部分注视的版本号: &

Java基础 1. 简述Java的基本历史 java起源于SUN公司的一个GREEN的项目,其原先目的是:为家用消费电子产品发送一个信息的分布式代码系统,通过发送信息控制电视机.冰箱等 2. 简单写出Java特点,写出5个以上,越多越好 简单的.面向对象的.分布式的.安全的.稳定的.与平台无关的.可解释的.多线的.动态的语言. 3. 什么是Java? JAVA:一种编程语言 一种开发环境 一种应用环境 一种部署环境 4. 请写出Java的版本分类,以及每种版本的应用方向 三种版本: JME:是面

在如今提倡节约资源的环境下,肯德基在品牌发展中,逐渐实现无纸化点餐,不仅节约了纸质点餐单,而且还具有节约资源的示范作用.而其中二维码扫描模组是这套无纸化点餐方案的重点,在整套设备中,加入二维码扫描模组,可以实现用户点餐与确认菜单功能. 为了走进年轻消费者的市场,肯德基K PRO除了在装潢风格.菜品上进行改变,也引入了诸多智能科技产品.随着肯德基K PRO的开业,新大陆的条码识读设备也正式投入到餐厅的服务中. 为了打造绿色餐厅,肯德基K PRO引入了无纸化点餐.“无纸化点餐”可以降低人工成本,减少

React使用DVA本地state传值取值 最近在用Ant Pro 做一个后台系统,在使用中发现Antd Pro使用DVA来实现redux+sagas+router一系列的功能,比传统方式要方便快捷的多,自己研究了其中一些原理,在此贴上代码供别人参考也给自己做个记录, 需要取值的页面 index.js import { connect } from 'dva'; //这里是一个语法糖,和传统的connect()()作用一样.即把对应models目录下的state取出与本页的变量关联. @conn

简单Qt教程 一.打开Qt Creator 本次的目的是用Qt Creator建立一个Hello World项目,在安装Qt之后,首先要打开Qt Creator. 就是它啦,打开后会显示如下页面. 二.建立新项目 点击文件——新建文件或项目 或者使用快捷键Ctrl+N便可以打开新建项目菜单. 这里选择其他项目——Empty qmake Project创建一个空的qt项目 HelloWorld_Qt. 一路下一步到完成之后就可以看到已经成功建立的项目HelloWorld_Qt. 这个生成的新项目包

近期在appfuse看到使用webtest-maven-plugin实现Web应用的集成測试,研究了下.感觉很不错.对于Web应用自己主动构建很有帮助,在性能測试之前能够保证Web应用的基本功能工作正常,分享给大家. WetTest工作原理 它是基于Ant来执行的Web页面的測试工具. 通过执行不同的target,測试页面上面提供的全部功能.它的工作原理是运用比較出名的HtmlUnit来实现对一个页面功能的測试. 它的工作流程就是模拟一个浏览器的事件(页面提供的功能:能够调用一个Url,能够点击

一.概述 原文地址:https://pro.ant.design/docs/import-cn 除了 antd 组件以及脚手架内置的业务组件,有时我们还需要引入其他外部模块,这里以引入富文本组件 react-quill 为例进行介绍. 二.使用 2.1.引入依赖 在终端输入下面的命令完成安装: npm install react-quill --save 注意:加上 --save 参数会自动添加依赖到 package.json 中去. 2.2.使用[在NewPage中] import React

引入Ant Design Pro 回顾 还是继续回顾下之前的作业, 返回的中文变成了ascii字符,不要紧,我们光荣地百度一哈. 随便点进去看看,都可以找到正确答案: 可以看到,我们需要修改config中的「JSON_AS_ASCII」字段为False. 但是我们本身是没有这个配置项的,所以直接给加上就好了. pity/config.py import osclass Config(object):    ROOT = os.path.dirname(os.path.abspath(__file

1.控制反转(Inversion of Control)是一种「思想」,依赖注入(Dependency Injection)则是这一思想的一种具体「实现方式」 2.react 要注意全局 id相同 3.Component series.scatter not exists. Load it first. 是echart的引入问题,另外,dom 必须要指定  style={{ width: 400, height: 400 }} 4.因为框架总是会引入很多概念,框架文档,应该是最好的概念说明书 5

一.概述 原文地址:https://pro.ant.design/docs/ui-test-cn UI 测试是项目研发流程中的重要一环,有效的测试用例可以梳理业务需求,保证研发的质量和进度,让工程师可以放心的重构代码和新增功能. Ant Design Pro 封装了一套简洁易用的 React 单元测试和 E2E 测试方案,在项目根目录运行以下命令就能运行测试用例. npm run test:all # 执行所有测试 二.详细 2.1.单元测试 单元测试用于测试 React UI 组件的表现.我们

一.概述 原文地址:https://pro.ant.design/docs/mock-api-cn Mock 数据是前端开发过程中必不可少的一环,是分离前后端开发的关键链路.通过预先跟服务器端约定好的接口,模拟请求数据甚至逻辑,能够让前端开发独立自主,不会被服务端的开发所阻塞. 在 Ant Design Pro 中,因为我们底层的工具是 roadhog,而它自带了代理请求功能,通过代理请求就能够轻松处理数据模拟的功能. 二.详细 2.1.使用 roadhog 的请求代理功能 在通过配置 .roa

一.概述 原文地址:https://pro.ant.design/docs/graph-cn Ant Design Pro 提供了由设计师精心设计抽象的图表类型,是在 BizCharts 图表库基础上的二次封装,同时提供了业务中常用的图表套件,可以单独使用,也可以组合起来实现复杂的展示效果. 目前一共包涵 10 个图表类型,以及 2 个图表套件: 饼状图(Pie) 柱状图(Bar) 仪表盘(Gauge) 雷达图(Radar) 标签云(TagCloud) 水波图(WaterWave) 迷你柱状图(

一.概述 原文地址:https://pro.ant.design/docs/deploy-cn 二.详细 2.1.构建 当项目开发完毕,只需要运行一行命令就可以打包你的应用: npm run build 由于 Ant Design Pro 底层使用的 roadhog 工具,已经将复杂的流程封装完毕,对于大部分场景,构建打包文件只需要一个命令 roadhog build,构建打包成功之后,会在根目录生成 dist 文件夹,里面就是构建打包好的文件,通常是 ***.js.***.css.index.

一.概述 参看地址:https://pro.ant.design/docs/style-cn 基础的 CSS 知识或查阅属性,可以参考 MDN文档. 二.详细介绍 2.1.less Ant Design Pro 默认使用 less 作为样式语言,建议在使用前或者遇到疑问时学习一下 less 的相关特性. 2.2.css modules 在样式开发过程中,有两个问题比较突出: 全局污染 —— CSS 文件中的选择器是全局生效的,不同文件中的同名选择器,根据 build 后生成文件中的先后顺序,后面

一.概述 参看地址:https://pro.ant.design/docs/new-component-cn 对于一些可能被多处引用的功能模块,建议提炼成业务组件统一管理.这些组件一般有以下特征: 只负责一块相对独立,稳定的功能: 没有单独的路由配置: 可能是纯静态的,也可能包含自己的 state,但不涉及 dva 的数据流,仅受父组件(通常是一个页面)传递的参数控制. 下面以一个简单的静态组件为例进行介绍.假设你的应用中经常需要展现图片,这些图片宽度固定,有一个灰色的背景和一定的内边距,有文字

一.概述 参看地址:https://pro.ant.design/docs/new-page-cn 这里的『页面』指配置了路由,能够通过链接直接访问的模块,要新建一个页面,通常只需要在脚手架的基础上进行简单的配置. 二.开发步骤 2.1.新增js.less文件 在 src/routes 下新建页面的NewPage.js 及 NewPage.less 文件,如果相关页面有多个,可以新建一个文件夹来放置相关文件. 样式文件默认使用 CSS Modules,如果需要,你可以在样式文件的头部引入 ant

在上一篇文章中,我们介绍了如何构建一个Ant Design Pro的环境. 同时讲解了如何启动服务并查看前端页面功能. 在本文中,我们将简单讲解如何在Ant Design Pro框架下实现自己的业务功能. 目录结构浅谈 首先,我们来简单了解一下整个项目的目录结构及其中每个文件的功能. 一个完整的目录结构如下:  其中,关于业务功能的代码都在src文件夹下. 而src中本身又包含着很多的子文件夹. 其中,我们最常用的应该了routes,services,models以及components. 下面

前言:前一篇记录了[后台管理系统]目前进展开发中遇到的一些应用点,这一篇会梳理一些自己学习Ant Design Pro源码的功能点.附:Ant Design Pro 在线预览地址. Dashboard指示板 pages/Dashboard 目录下:Analysis.js分析页.Monitor.js指控页.WorkPlace.js工作台 用到的一些技术点:react v16.6 动态 import,React.lazy().Suspense.Error boundaries (来源:Postbir

脚手架搭建 git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project 然后 cd my-project 项目的目录结构: config umi配置,包含路由,构建等配置 mock 本地模拟数据 public favicon Favicon src assets 本地静态资源 components 业务通用组件 e2e 集成测试用例 layouts 通用布局 models 全局 dva model

一.简介 1.Ant Design Pro Ant Design Pro是一款搭建中后台管理控制台的脚手架 ,基于React,dva.js,Ant Design (1)其中dva主要是控制数据流向,是纯粹的数据流,用作状态管理 使用React技术栈管理大型复杂的应用往往要使用Redux来管理应用的状态,然而随着深度使用,Redux也暴露出了一些问题.dva 是一种改良Redux的架构方案,是基于现有应用架构 (redux + react-router + redux-saga 等)的一层轻量封装