Permalink
Browse files

add data-api support for log statistics

  • Loading branch information...
warmhug committed Oct 11, 2016
1 parent d062b60 commit 8972f980d0dddee30fd61ebaa0f75fc07a7a36b3
@@ -0,0 +1,9 @@
export default function getDataAttr(props) {
const dataAttrs = {};
Object.keys(props).forEach(i => {
if (i.indexOf('data-') === 0) {
dataAttrs[i] = props[i];
}
});
return dataAttrs;
}
@@ -24,6 +24,7 @@ const Test = React.createClass({
// title: '标题',
message: '我是描述我是描述',
maskClosable: true,
'data-seed': 'logId',
},
(buttonIndex) => {
this.setState({ clicked: BUTTONS[buttonIndex] });
@@ -6,23 +6,12 @@ import Dialog from 'rc-dialog';
import classNames from 'classnames';
import Icon from '../icon/index.web';
import assign from 'object-assign';
import getDataAttr from '../_util/getDataAttr';
import ButtonListItem from './ButtonListItem.web';

const NORMAL = 'NORMAL';
const SHARE = 'SHARE';

function noop() { }

function getDataAttr(props) {
const dataAttrs = {};
Object.keys(props).forEach(i => {
if (i.indexOf('data-') === 0) {
dataAttrs[i] = props[i];
}
});
return dataAttrs;
}

const queue = [];

function createActionSheet(flag, config, callback) {
@@ -19,7 +19,7 @@ const ButtonExample = React.createClass({
<div style={{ margin: '0 8px' }}>
<div style={{ margin: '32px 0' }}>
<Button>default 按钮</Button>
<Button data-seed="logId">default 按钮</Button>
<div style={{ height: 8 }} />
<Button disabled>default disabled 按钮</Button>
</div>
@@ -2,6 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import Checkbox from './Checkbox.web';
import AgreeItemProps from './AgreeItemPropsType';
import getDataAttr from '../_util/getDataAttr';

export default class AgreeItem extends React.Component<AgreeItemProps, any> {
static defaultProps = {
@@ -15,7 +16,7 @@ export default class AgreeItem extends React.Component<AgreeItemProps, any> {
[className]: className,
});

return (<div
return (<div {...getDataAttr(this.props)}
className={wrapCls}
style={style}
>
@@ -3,6 +3,7 @@ import classNames from 'classnames';
import Checkbox from './Checkbox.web';
import List from '../list/index.web';
import CheckboxItemProps from './CheckboxItemPropsType';
import getDataAttr from '../_util/getDataAttr';

const ListItem = List.Item;

@@ -25,7 +26,7 @@ export default class CheckboxItem extends React.Component<CheckboxItemProps, any

const onClickProps = disabled ? {} : { onClick: () => {} };

return (<ListItem
return (<ListItem {...getDataAttr(this.props)}
prefixCls={listPrefixCls}
style={style}
className={wrapCls}
@@ -18,7 +18,7 @@ let AgreeItemExample = React.createClass({
render() {
const { getFieldProps } = this.props.form;
return (
<AgreeItem
<AgreeItem data-seed="logId"
{...getFieldProps('agreeitem1', {
initialValue: false,
valuePropName: 'checked',
@@ -22,7 +22,7 @@ let CheckboxItemExample = React.createClass({
<List
renderHeader={() => '多项选择操作'}
>
<CheckboxItem
<CheckboxItem data-seed="logId"
{...getFieldProps('checkboxitem1', {
initialValue: true,
valuePropName: 'checked',
@@ -17,6 +17,7 @@ let BasicInputExample = React.createClass({
<InputItem
defaultValue=""
placeholder="设置defaultValue,不设置value"
data-seed="logId"
>非受控</InputItem>
<InputItem
{...getFieldProps('control', {
@@ -37,4 +38,4 @@ ReactDOM.render(<BasicInputExample />, mountNode);
.demoTitle:after {
border-bottom: none;
}
````
````
@@ -2,6 +2,7 @@ import React from 'react';
import classNames from 'classnames';
function noop() { }
import InputItemProps from './InputItemPropsType';
import getDataAttr from '../_util/getDataAttr';

function fixControlledValue(value) {
if (typeof value === 'undefined' || value === null) {
@@ -180,7 +181,7 @@ export default class InputItem extends React.Component<InputItemProps, InputItem
}

return (
<div className={wrapCls} style={style}>
<div {...getDataAttr(this.props)} className={wrapCls} style={style}>
{children ? (<div className={labelCls}>{children}</div>) : null}
<div className={`${prefixCls}-control`}>
<input
@@ -44,7 +44,7 @@ same as [React Native ListView](https://facebook.github.io/react-native/docs/lis
- useZscroller (boolean, false) - 使用 zscroller 来支持 RefreshControl (`useBodyScroll` and sticky 失效)
- scrollerOptions - [zscroller options](https://github.com/yiminghe/zscroller#options)

### ListView.IndexedList (beta)
### ListView.IndexedList
> 注意:由于需要直接scroll到任意位置、只支持分两步渲染,所以列表数据量过大时、性能会有影响
支持右侧导航功能
@@ -1,6 +1,7 @@
import React from 'react';
import classNames from 'classnames';
import { ListItemProps, BriefProps } from './ListPropTypes';
import getDataAttr from '../_util/getDataAttr';

export class Brief extends React.Component<BriefProps, any> {
render() {
@@ -102,7 +103,7 @@ export default class ListItem extends React.Component<ListItemProps, any> {
}

return (
<div
<div {...getDataAttr(this.props)}
className={wrapCls}
onClick={this.onClick}
onTouchStart={this.onTouchStart}
@@ -16,7 +16,7 @@ let ListExample = React.createClass({
renderHeader={() => '我是华丽丽的列表头部'}
renderFooter={() => '我是列表尾部'}
>
<List.Item>标题文字点击无反馈,文字超长则隐藏</List.Item>
<List.Item data-seed="logId">标题文字点击无反馈,文字超长则隐藏</List.Item>
<List.Item wrap>文字超长折行文字超长折行文字超长折行文字超长折行文字超长折行文字超长折行</List.Item>
<List.Item
onClick={() => {}}
@@ -17,7 +17,7 @@ const NoticeBarExample = React.createClass({
return (
<div>
<WhiteSpace size="lg" />
<NoticeBar mode="link" onClick={linkClick}>
<NoticeBar mode="link" onClick={linkClick} data-seed="logId">
国庆期间余额宝收益和转出到账时间
</NoticeBar>
<WhiteSpace size="lg" />
@@ -1,6 +1,7 @@
/* tslint:disable:no-switch-case-fall-through */
import React from 'react';
import classNames from 'classnames';
import getDataAttr from '../_util/getDataAttr';
import Icon from '../icon';
import NoticeBarProps from './NoticeBarPropsType';

@@ -81,7 +82,7 @@ export default class NoticeBar extends React.Component<NoticeBarProps, any> {
</div> : null;
return this.state.show ? (
<div className={wrapCls}>
<div {...getDataAttr(this.props)} className={wrapCls}>
{iconDom}
<div className={`${prefixCls}-content`}>{children}</div>
{operationDom}
@@ -34,7 +34,7 @@ const App = React.createClass({
<Popover
visible={this.state.visible}
overlay={[
(<Item key="4" value="scan" iconName="scan">扫一扫</Item>),
(<Item key="4" value="scan" iconName="scan" data-seed="logId">扫一扫</Item>),
(<Item key="5" value="special" iconName="qrcode" style={{ whiteSpace: 'nowrap' }}>我的二维码</Item>),
(<Item key="6" value="button ct" iconName="question-circle-o">
<span style={{ marginRight: 5 }}>帮助</span>
@@ -1,6 +1,6 @@
import React from 'react';
import Tooltip from 'rc-tooltip';
import Item from './item';
import Item from './item.web';
import splitObject from '../_util/splitObject';
import tsPropsType from './PropsType';

@@ -2,6 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import Radio from './Radio.web';
import List from '../list';
import getDataAttr from '../_util/getDataAttr';

const ListItem = List.Item;

@@ -25,7 +26,7 @@ export default class RadioItem extends React.Component<RadioItemProps, any> {

const onClickProps = disabled ? {} : { onClick: () => {} };

return (<ListItem
return (<ListItem {...getDataAttr(this.props)}
prefixCls={listPrefixCls}
style={style}
className={wrapCls}
@@ -41,6 +41,7 @@ const Test = React.createClass({
checked={this.state.value === 1}
onChange={this.handleChange}
disabled={this.state.disabled}
data-seed="logId"
>
博士
</RadioItem>
@@ -9,7 +9,7 @@ class Tab extends React.Component<any, any> {

const iconRes = selected ? selectedIcon : icon;
return (
<div>
<div {...this.props.dataAttrs}>
<div className={`${prefixCls}-icon`}>
{ badge ? (
<Badge text={badge} className={`${prefixCls}-badge`}>
@@ -52,6 +52,7 @@ const TabBarExample = React.createClass({
selectedTab: 'blueTab',
});
}}
data-seed="logId"
>
{this.renderContent('生活')}
</TabBar.Item>
@@ -67,6 +68,7 @@ const TabBarExample = React.createClass({
selectedTab: 'redTab',
});
}}
data-seed="logId1"
>
{this.renderContent('口碑')}
</TabBar.Item>
@@ -3,6 +3,7 @@ import Tabs, { TabPane } from 'rc-tabs';
import Tab from './Tab.web';
import TabContent from 'rc-tabs/lib/TabContent';
import TabBar from 'rc-tabs/lib/TabBar';
import getDataAttr from '../_util/getDataAttr';

const AntTabBar = React.createClass({
statics: {
@@ -57,6 +58,7 @@ const AntTabBar = React.createClass({
title={cProps.title}
tintColor={tintColor}
unselectedTintColor={unselectedTintColor}
dataAttrs={getDataAttr(cProps)}
/>);
return (
<TabPane
@@ -14,7 +14,7 @@ function onChange(selected) {
ReactDOM.render(
<div className="tag-container">
<Tag>通用标签</Tag>
<Tag data-seed="logId">通用标签</Tag>
<Tag selected>默认选中</Tag>
<Tag disabled>失效标签</Tag>
<Tag onChange={onChange}>事件回调</Tag>
@@ -2,6 +2,7 @@ import React from 'react';
import classNames from 'classnames';
import TagProps from './TagPropsType';
import Icon from '../icon';
import getDataAttr from '../_util/getDataAttr';

export default class Tag extends React.Component<TagProps, any> {
static defaultProps = {
@@ -63,7 +64,7 @@ export default class Tag extends React.Component<TagProps, any> {
});

return !this.state.closed ? (
<div className={wrapCls} onClick={this.onClick} style={style}>
<div {...getDataAttr(this.props)} className={wrapCls} onClick={this.onClick} style={style}>
<div className={`${prefixCls}-text`}>{children}</div>
{ closable && !disabled && !small && <div
className={`${prefixCls}-close`}
@@ -17,6 +17,7 @@ let TextareaItemExample = React.createClass({
title="非受控"
defaultValue=""
placeholder="设置defaultValue,不设置value"
data-seed="logId"
/>
<TextareaItem
title="受控组件"
@@ -66,4 +67,4 @@ ReactDOM.render(<TextareaItemExample />, mountNode);
.demoTitle:after {
border-bottom: none;
}
````
````
@@ -3,6 +3,7 @@ import classNames from 'classnames';
function noop() {}

import TextareaItemProps from './TextAreaItemPropsType';
import getDataAttr from '../_util/getDataAttr';

function fixControlledValue(value) {
if (typeof value === 'undefined' || value === null) {
@@ -147,7 +148,7 @@ export default class TextareaItem extends React.Component<TextareaItemProps, Tex
});

return (
<div className={wrapCls} style={style}>
<div {...getDataAttr(this.props)} className={wrapCls} style={style}>
{title ? (<div className={labelCls}>{title}</div>) : null}
<div className={`${prefixCls}-control`}>
<textarea

0 comments on commit 8972f98

Please sign in to comment.