/**
* 数据屏蔽
* Created by 2016-12-02.
*/
import React, {Component} from 'react'; export default class DataMaskingMain extends Component {
render() {
return (
<div>
开发中……
</div>
)
}
}
//定义一个组件
renderData = (history, xyml, columns, dataSource) => {
if (!history.id || !xyml.itemId) {
return <div style={{textAlign: 'center',marginTop: 30}}>暂无数据</div>;
} else return (
<Table bordered
size="small"
columns={columns}
dataSource={dataSource}
pagination={false}/>
) };
//================= render() {
return (
<div> <div className="block-box-header">
<div className="block-box-body">
          //调用组件
{this.renderData(history, xyml, columns, dataSource)}
</div>
</div>
</div> );
}

react 组件创建的更多相关文章

  1. React: React组件创建的三种方式

    一.简介 在前面介绍的React组件知识中,对于组件的创建我只是用了其中某一种方式.其实,在2013年React诞生之初,对于React组件的创建,仅仅只有一种方式,也即createClass函数,在 ...

  2. 二、React初体验之React组件创建

    (中间因为应付各种考试,处理其他事情,隔了好时间没更新,现在终于有时间了,续上!) 本文为React初始体验,因此先不考虑文件如何组织,尽量以最简单的方式让大家了解React其中的原理. 在创建组件( ...

  3. React 组件开发注意事项

    0.state的设定原则,如果render里用不到,则就不应该是一个state. 1.数组遍历时,用每一条数据的唯一标识作为key,尽量不要使用遍历的索引值作为key,如果它们从不重新排序,它们工作也 ...

  4. 1.3 React 组件

    1.3.1 React 组件介绍 在 React 中组件是第一元素,是 React 的基础,一个 React 应用就是基于 React 组件的组合而成.前面的 JSX 练习过后,大家应该对 React ...

  5. angular,vue,react的基本语法—动态属性、事件绑定、ref,angular组件创建方式

    基本语法: 动态属性: vue: v-bind:attr="msg" :attr="msg" react: attr={msg} angular [attr]= ...

  6. react组件的创建

    最近项目接触react和rn,之前会一些vue和小程序,起初写react是很难受的,尤其是jsx的写法,不过2周过后感觉写起来有点舒服了... 目前react的组件一共有3种方式:React.crea ...

  7. 用 nodejs 写一个命令行工具 :创建 react 组件的命令行工具

    用 nodejs 写一个命令行工具 :创建 react 组件的命令行工具 前言 上周,同事抱怨说 react 怎么不能像 angular 那样,使用命令行工具来生成一个组件.对呀,平时工作时,想要创建 ...

  8. React中创建组件的3种方式

    目前作者所知道的创建react组件的方式有三种: 函数式定义(无状态组件) function MyComponent(props){ return( <h1>mycomponent< ...

  9. webStrom快捷键快速创建React组件

    1. rcc + tab键 - - 用ES6模块系统创建一个React组件类 2. rccp + tab键 - - 创建一个带有PropTypes和ES6模块系统的React组件类 3. rcfc + ...

随机推荐

  1. PHP json_encode转换 不对url进行解析

    echo json_encode($array,JSON_UNESCAPED_SLASHES);

  2. PAT乙级1044

    题目链接 https://pintia.cn/problem-sets/994805260223102976/problems/994805279328157696 题解 需要注意的几个点: 题目有指 ...

  3. MySQL常见水平分表技术方案

    根据经验,Mysql表数据一般达到百万级别,查询效率会很低,容易造成表锁,甚至堆积很多连接,直接挂掉:水平分表能够很大程度较少这些压力. 1.按时间分表 这种分表方式有一定的局限性,当数据有较强的实效 ...

  4. ppt打不开,显示发现文件中的内容有问题。可尝试修复此演示文稿

    ppt打不开,显示发现文件中的内容有问题.可尝试修复此演示文稿 PPT发现要打开的文件有问题,修复后无法打开该文件 解决方法: 主要是因为文件是网络下载的,office自动锁定了文件(默认不可编辑). ...

  5. fixed 失效

    1. 父元素设置 transform 属性后, 会导致 position: fixed 失效. 2. 设置以下属性也会影响 fixed 属性. -webkit-perspective: 1000; - ...

  6. RX232串口发送

    在进行工程调试的时候有时候需要对变量进行观察,SingnaTap II Logic Analyzer 只能对管脚进行观察,所以要观察内部的变量必须把内部的变量进行输出.一种方法是直接把变量定义成管脚通 ...

  7. unix/linux 进程间文件锁

    转自 http://www.cnblogs.com/hjslovewcl/archive/2011/03/14/2314333.html 有三种不同的文件锁,这三种都是“咨询性”的,也就是说它们依靠程 ...

  8. win10下安装docker

    win10下安装docker 1. 启用Hyper-V 打开控制面板 - 程序和功能 - 启用或关闭Windows功能,勾选Hyper-V,然后点击确定(整个过程需要重新启动几次),如图: 安装Doc ...

  9. vue中.sync修饰符,实现子组件实时更新父组件的值

    vue 修饰符sync的功能是:当一个子组件改变了一个 prop 的值时,这个变化也会同步到父组件中所绑定. 不过它有一个前身,先来看看.sync出现之前是如何实现的 父组件中(传递给子组件一个值:p ...

  10. Js 中那些 隐式转换

    曾经看到过这样一个代码:  (!(~+[])+{})[--[~+""][+[]]*[~+[]]+~~!+[]]+({}+[])[[~!+[]*~+[]]] = sb , 你敢相信, ...