add data-api support for log statistics

ant-design · Oct 11, 2016 · 8972f98 · 8972f98
1 parent d062b60
commit 8972f98
Show file tree

Hide file tree

Showing 27 changed files with 46 additions and 32 deletions.
diff --git a/components/_util/getDataAttr.tsx b/components/_util/getDataAttr.tsx
@@ -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;
+}
diff --git a/components/action-sheet/demo/basic.md b/components/action-sheet/demo/basic.md
@@ -24,6 +24,7 @@ const Test = React.createClass({
       // title: '标题',
       message: '我是描述我是描述',
       maskClosable: true,
+      'data-seed': 'logId',
     },
     (buttonIndex) => {
       this.setState({ clicked: BUTTONS[buttonIndex] });

diff --git a/components/action-sheet/index.web.tsx b/components/action-sheet/index.web.tsx
@@ -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) {

diff --git a/components/button/demo/basic.md b/components/button/demo/basic.md
@@ -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>

diff --git a/components/checkbox/AgreeItem.web.tsx b/components/checkbox/AgreeItem.web.tsx
@@ -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}
     >

diff --git a/components/checkbox/CheckboxItem.web.tsx b/components/checkbox/CheckboxItem.web.tsx
@@ -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}

diff --git a/components/checkbox/demo/agreeitem.md b/components/checkbox/demo/agreeitem.md
@@ -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',

diff --git a/components/checkbox/demo/checkboxitem.md b/components/checkbox/demo/checkboxitem.md
@@ -22,7 +22,7 @@ let CheckboxItemExample = React.createClass({
         <List
           renderHeader={() => '多项选择操作'}
         >
-          <CheckboxItem
+          <CheckboxItem data-seed="logId"
             {...getFieldProps('checkboxitem1', {
               initialValue: true,
               valuePropName: 'checked',

diff --git a/components/input-item/demo/1.md b/components/input-item/demo/1.md
@@ -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;
 }
-````
+````
diff --git a/components/input-item/index.web.tsx b/components/input-item/index.web.tsx
@@ -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

diff --git a/components/list-view/index.md b/components/list-view/index.md
@@ -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到任意位置、只支持分两步渲染，所以列表数据量过大时、性能会有影响
 
 支持右侧导航功能

diff --git a/components/list/ListItem.web.tsx b/components/list/ListItem.web.tsx
@@ -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}

diff --git a/components/list/demo/basic.md b/components/list/demo/basic.md
@@ -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={() => {}}

diff --git a/components/notice-bar/demo/link.md b/components/notice-bar/demo/link.md
@@ -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" />

diff --git a/components/notice-bar/index.web.tsx b/components/notice-bar/index.web.tsx
@@ -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}

diff --git a/components/popover/demo/basic.md b/components/popover/demo/basic.md
@@ -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>

diff --git a/components/popover/index.web.tsx b/components/popover/index.web.tsx
@@ -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';
 

diff --git a/components/popover/item.tsx → components/popover/item.web.tsx b/components/popover/item.tsx → components/popover/item.web.tsx
diff --git a/components/radio/RadioItem.web.tsx b/components/radio/RadioItem.web.tsx
@@ -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}

diff --git a/components/radio/demo/RadioItem.md b/components/radio/demo/RadioItem.md
@@ -41,6 +41,7 @@ const Test = React.createClass({
             checked={this.state.value === 1}
             onChange={this.handleChange}
             disabled={this.state.disabled}
+            data-seed="logId"
           >
             博士
           </RadioItem>

diff --git a/components/tab-bar/Tab.web.tsx b/components/tab-bar/Tab.web.tsx
@@ -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`}>

diff --git a/components/tab-bar/demo/basic.md b/components/tab-bar/demo/basic.md
@@ -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>

diff --git a/components/tab-bar/index.web.tsx b/components/tab-bar/index.web.tsx
@@ -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

diff --git a/components/tag/demo/basic.md b/components/tag/demo/basic.md
@@ -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>

diff --git a/components/tag/index.web.tsx b/components/tag/index.web.tsx
@@ -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`}

diff --git a/components/textarea-item/demo/1.md b/components/textarea-item/demo/1.md
@@ -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;
 }
-````
+````
diff --git a/components/textarea-item/index.web.tsx b/components/textarea-item/index.web.tsx
@@ -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