小二助手(react应用框架)-概述
时间想学习一个前端框架,原因是这样的,我本身是做游戏的,但是自己对前端web比较感兴趣。
然后我就选择自己学哪个框架,Angular、react、vue
最后选择了react,选择的理由就不说了
那做个什么东西来学习哪?我和一个朋友搞游戏创业,两个人。日常需要记录知识点、记账、任务管理,所有想就做一个自己用的系统吧!
所以后面用业余时间做了一些.浏览地址http://118.25.217.253:4000 账号test密码123 qq讨论群:836719189


我先说下这个东西用了哪些技术,做了哪些尝试吧,后面有时间慢慢更新内容
技术点
前端:react react-route material-ui
后端:.net core mysql
哪些尝试?
很多后台都是crud操作,所有我做了通用的crud界面。
那么比如你要做个知识库管理,包括分类管理,知识管理。

分类管理页面里是这样的
import React from 'react';
import ObjectPage from '../object/object-page' //定义列
const columnData = [
{ id: 'name', type: 'text', listshow: true,editshow:true,infoshow:true, label: '名称', sort: true, width: 'auto',verify:{required:true,range:"3-50"} },
]; class KnowledgeCategoryPage extends React.Component {
render() {
return (
<ObjectPage
title='知识分类'
apicontroller='KnowledgeCategory'
showCheckBox={false}
isFullScreen={false}
showOperation={true}
dataPageSize={14}
columnData={columnData} />
);
}
}
export default KnowledgeCategoryPage;
知识页面是这样的
import React from 'react';
import ObjectPage from '../object/object-page'
//定义列
const columnData = [
{ id: 'title', type: 'text', listshow: true,editshow:true,infoshow:true, label: '标题', sort: true, width: 'auto',verify:{required:true,range:"0-50"} },
{ id: 'content', type: 'textare', listshow: false,editshow:true,infoshow:true, label: '内容', sort: true, width: 'auto'},
{ id: 'categoryID', type: 'select', listshow: false,editshow:true,infoshow:false, label: '分类', sort: true, width: 'auto'},
{ id: 'categoryName', type: 'text', listshow: false,editshow:false,infoshow:true, label: '分类', sort: true, width: 'auto'},
]; class KnowledgePage extends React.Component {
render() {
return (
<ObjectPage
title='知识'
apicontroller='Knowledge'
urlpar={this.props.match.params.category}
showCheckBox={false}
isFullScreen={true}
showOperation={false}
dataPageSize={14}
columnData={columnData} />
);
}
}
export default KnowledgePage;
另外两个文件一个是知识页面的左边分类选择控件,另外一个是负责路由(可以拆分js包),然后就没有了.......
小二助手(react应用框架)-概述的更多相关文章
- 小二助手-react.js分块加载
小二助手在线演示地址:http://118.25.217.253:8000 账号test 密码123 小二助手是用material-ui开发的,感觉国内使用的人数不是特别多,所以创建了一个qq交流群 ...
- React框架概述
一.React框架概述 官网:https://reactjs.org/ 最新版V16.10 中文网:https://zh-hans.reactjs.org/ 中文社区网:https://r ...
- Entity Framework 学习总结之一:ADO.NET 实体框架概述
http://www.cnblogs.com/xlovey/archive/2011/01/03/1924800.html ADO.NET 实体框架概述 新版本中的 ADO.NET 以新实体框架为特色 ...
- ThinkPHP框架概述
框架概述 1.什么是框架 框架,即framework.其实就是某种应用的半成品,就是一组组件,供你选用完成你自己的系统. 2.框架的应用场景 ① 代码重用 ② 合理分工 ③ 解决团队协作开发问题 3. ...
- iOS Foundation 框架概述文档:常量、数据类型、框架、函数、公布声明
iOS Foundation 框架概述文档:常量.数据类型.框架.函数.公布声明 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业 ...
- struts2框架概述
框架概述 什么是框架,为什么使用框架,框架优点 框架(framework)是一个基本概念上的结构,用于去解决或者处理复杂的问题 框架,即framework.其实就是某种应用的半成品,就是一组组件,供你 ...
- 芝麻软件: Python爬虫进阶之爬虫框架概述
综述 爬虫入门之后,我们有两条路可以走. 一个是继续深入学习,以及关于设计模式的一些知识,强化Python相关知识,自己动手造轮子,继续为自己的爬虫增加分布式,多线程等功能扩展.另一条路便是学习一些优 ...
- React 等框架使用 index 做 key 的问题
React 等框架使用 index 做 key 的问题 假如有两个树,一个是之前,一个是更变之后,我们抽象成两种可能性. 插入内容在最后 插入内容在最前 关于插在中间,原理一样,就不阐述. 使用 ul ...
- 写写Django中DRF框架概述以及序列化器对象serializer的构造方法以及使用
写写Django中DRF框架概述以及序列化器对象serializer的构造方法以及使用 一.了解什么是DRF DRF: Django REST framework Django REST framew ...
- Python爬虫进阶一之爬虫框架概述
综述 爬虫入门之后,我们有两条路可以走. 一个是继续深入学习,以及关于设计模式的一些知识,强化Python相关知识,自己动手造轮子,继续为自己的爬虫增加分布式,多线程等功能扩展.另一条路便是学习一些优 ...
随机推荐
- Codeforces 950E Data Center Maintenance 强连通分量
题目链接 题意 有\(n\)个信息中心,每个信息中心都有自己的维护时间\((0\leq t\lt h)\),在这个时刻里面的信息不能被获得. 每个用户的数据都有两份备份,放在两个相异的信息中心(维护时 ...
- django-crontab
django-cromtab实现定时任务 参考:https://www.jianshu.com/p/1def9226158d ''' 首先安装插件:pip install django-crontab ...
- python基础===python3 get和post请求(转载)
get请求 #encoding:UTF-8 importurllib importurllib.request data={} data['name']='aaa' url_parame=urllib ...
- strace 命令是一种强大的工具,它能够显示所有由用户空间程序发出的系统调用。
strace 命令是一种强大的工具,它能够显示所有由用户空间程序发出的系统调用. http://bbs.51cto.com/thread-1106891-1.html
- servlet(6) - servlet总结 - 小易Java笔记
垂阅前必看: 这都是我总结的我觉得是学习servlet应该掌握的,我在学习期间也做了一个博客项目来让所学的知识得以巩固.下面就是博客项目链接.前面的servlet相关的笔记总汇,还有就是我把觉得在学习 ...
- [ 总结 ] Linux下两种常用的双网卡绑定
1. mode=0 (round-robin) 链路聚合:将两个或者更多数据信道结合成一个单一的信道,该信道以一个更高带宽的逻辑链路出现,链路聚合一般用来连接一个或多个带宽需求量大的设备,链路聚合是指 ...
- [ nginx ] 代理后端tomcat 无法显示图片报错:ERR_CONTENT_LENGTH_MISMATCH
问题日志如下:
- hdu 2236(二分图最小点覆盖+二分)
无题II Time Limit: 2000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- MATLAB作图方法与技巧(二)
作为MATLAB作图方法与技巧(一)的补充 1.绘制二维散点图 ① scatter函数 scatter(x,y,s,c)函数绘制向量x和y的散点图,其中s代表点的大小,c代表点的形状,s和c缺省时为默 ...
- 杀掉TOMCAT并重启的脚本
/usr/local/tomcat7/bin/shutdown.sh sleep #具体时间就看你得webapp在调用shutdown.sh后多久后处于僵死状态 ps -ef | grep sleep ...