{"action":"created","issue":{"url":"https://api.github.com/repos/ant-design/ant-design/issues/973","labels_url":"https://api.github.com/repos/ant-design/ant-design/issues/973/labels{/name}","comments_url":"https://api.github.com/repos/ant-design/ant-design/issues/973/comments","events_url":"https://api.github.com/repos/ant-design/ant-design/issues/973/events","html_url":"https://github.com/ant-design/ant-design/issues/973","id":130288645,"number":973,"title":"你们是否会考虑下 typescript 的支持呢","user":{"login":"maolion","id":1732779,"avatar_url":"https://avatars.githubusercontent.com/u/1732779?v=3","gravatar_id":"","url":"https://api.github.com/users/maolion","html_url":"https://github.com/maolion","followers_url":"https://api.github.com/users/maolion/followers","following_url":"https://api.github.com/users/maolion/following{/other_user}","gists_url":"https://api.github.com/users/maolion/gists{/gist_id}","starred_url":"https://api.github.com/users/maolion/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/maolion/subscriptions","organizations_url":"https://api.github.com/users/maolion/orgs","repos_url":"https://api.github.com/users/maolion/repos","events_url":"https://api.github.com/users/maolion/events{/privacy}","received_events_url":"https://api.github.com/users/maolion/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2016-02-01T08:07:59Z","updated_at":"2016-02-01T18:43:36Z","closed_at":"2016-02-01T10:45:24Z","body":"主要是以下几个原因:\r\n\r\n- 因为 typescript有比较强的类型系统，适合你们这些轮子服务组织。\r\n- typescript对react支持的很好（同时react对typescript支持的也很好）\r\n- typescript的方向是 es6 和es7 的超前 我说的超前是typescript 比 es6, es7 的步伐快 (或者 将来的 es N 都可能是按照 typescript实现做规划)\r\n\r\n因为看到你们项目 是基于 es6, 所以这里大胆的安利下 typescript, 希望大神别怪，  毕竟 从客观主关上来说 typescript都比es6 好用。\r\n\r\n或者 要不要考虑下提供一份比较完整的typescript 类型定义文件？\r\n"},"comment":{"url":"https://api.github.com/repos/ant-design/ant-design/issues/comments/178119814","html_url":"https://github.com/ant-design/ant-design/issues/973#issuecomment-178119814","issue_url":"https://api.github.com/repos/ant-design/ant-design/issues/973","id":178119814,"user":{"login":"maolion","id":1732779,"avatar_url":"https://avatars.githubusercontent.com/u/1732779?v=3","gravatar_id":"","url":"https://api.github.com/users/maolion","html_url":"https://github.com/maolion","followers_url":"https://api.github.com/users/maolion/followers","following_url":"https://api.github.com/users/maolion/following{/other_user}","gists_url":"https://api.github.com/users/maolion/gists{/gist_id}","starred_url":"https://api.github.com/users/maolion/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/maolion/subscriptions","organizations_url":"https://api.github.com/users/maolion/orgs","repos_url":"https://api.github.com/users/maolion/repos","events_url":"https://api.github.com/users/maolion/events{/privacy}","received_events_url":"https://api.github.com/users/maolion/received_events","type":"User","site_admin":false},"created_at":"2016-02-01T18:43:36Z","updated_at":"2016-02-01T18:43:36Z","body":"今天升级了0.12.0 发现你们的改动。做了下其中一个模块的适配, 目的是再次安利typescirpt \r\n\r\n```typescript\r\ninterface TestFormProps extends React.HTMLAttributes, React.Props<any> {\r\n    p1: string;\r\n}\r\n@Mao.decorators.form()\r\nclass TestForm extends React.Component<TestFormProps, any> {\r\n    render() {\r\n        const formProps: Form.Props = this.props as any; \r\n        const formHelper = formProps.form;\r\n        \r\n        return (\r\n            <Form action=\"account/test\" form={formHelper}>\r\n                <FormItem\r\n                    label=\"姓名\"\r\n                    labelCol={{span: 7}}\r\n                    wrapperCol={{span: 7}}\r\n                    hasFeedback\r\n                    help={(formHelper.getFieldError('name') || []).join(', ')}\r\n                    className=\"clearfix\">\r\n                    <Input \r\n                        name=\"name\" \r\n                        placeholder=\"输入姓名\" \r\n                        {...formHelper.getFieldProps('name', {\r\n                            rules: [\r\n                                { required: true, min: 5, message: '用户至少为5个字符' }\r\n                            ]\r\n                        })} />\r\n                </FormItem>\r\n                <Button htmlType=\"submit\">submit</Button>\r\n            </Form>\r\n        );\r\n    }\r\n}\r\n```\r\n\r\n类装饰器, 包装了你们的Form.create装饰器\r\n```\r\nimport * as React from 'react';\r\nimport * as ReactDom from 'react-dom';\r\nimport * as Lodash from 'lodash';\r\nimport * as $ from 'jquery';\r\nimport * as serialize from 'form-serialize';\r\nimport { Form } from 'antd';\r\nimport { action, helpers } from '../';\r\n\r\nexport default function form(): ClassDecorator {\r\n    return (DecoratedComponent: any) => {\r\n        \r\n        @Form.create()\r\n        class FormDecorator extends React.Component<any, any> {\r\n            \r\n            private unmounted: boolean;\r\n            \r\n            componentDidMount() {\r\n                let form = ReactDom.findDOMNode(this) as HTMLFormElement;\r\n                if (form.nodeName != 'FORM') {\r\n                    form = $('form', form)[0] as HTMLFormElement;\r\n                }\r\n                \r\n                form.onsubmit = this.handleSubmit.bind(this, form);\r\n            }\r\n            \r\n            componentWillUnmount() {\r\n                this.unmounted = true;\r\n            }\r\n            \r\n            render() {\r\n                let props = Lodash.assign({ form: {} }, this.props) as any;\r\n                \r\n                props.ref = 'target';\r\n                \r\n                return <DecoratedComponent {...props} />;\r\n            }\r\n            \r\n            private handleSubmit(form: HTMLFormElement, e?: any) {\r\n                e && e.preventDefault();\r\n \r\n                const target = this.refs['target'] as any;\r\n                \r\n                let formHelper = (this.props as Form.Props).form;\r\n                let $inputs = $('input[name], textarea[name], select[name], button[type=submit]', form);\r\n                \r\n                $inputs.prop('disabled', true);\r\n                \r\n                if (target.state) {\r\n                    target.state.submitting = true;\r\n                } else {\r\n                    target.state = { submitting: true };\r\n                }\r\n                \r\n                \r\n                formHelper.validateFields((errors: any, values: any) => {\r\n                    \r\n                    if (!!errors) {\r\n                        console.log(\"aaa\");\r\n                        $inputs.prop('disabled', false);\r\n                        target.setState({ submitting : false });\r\n                        return;\r\n                    }\r\n                    \r\n                    let formData = serialize<any>(form, { hash: true });\r\n                    \r\n                    if (target.handleSubmit instanceof Function && target.handleSubmit(formData) == false) {\r\n                        target.setState({ submitting : false });\r\n                        $inputs.prop('diabled', false);\r\n                        return false;\r\n                    }\r\n                    \r\n                    action(form.getAttribute('action'), formData)\r\n                        .then(data => {\r\n                            if (this.unmounted) {\r\n                                return;\r\n                            }\r\n                            \r\n                            target.setState({ submitting: false });\r\n                            $inputs.prop('disabled', false);\r\n                            \r\n                            if (target.handleDone instanceof Function) {\r\n                                target.handleDone(data);\r\n                            }\r\n                            \r\n                        })\r\n                        .fail(error => {\r\n                            if (this.unmounted) {\r\n                                return;\r\n                            }\r\n                            \r\n                            target.setState({\r\n                                error: error.message,\r\n                                submitting: false\r\n                            });\r\n                            \r\n                            if (target.handleError instanceof Function) {\r\n                                target.handleError(error);\r\n                            }\r\n                            \r\n                            $inputs.prop('disabled', false);\r\n                            \r\n                            $inputs.on('change input', function() {\r\n                                target.setState({ error: null });\r\n                                $inputs.off('change, input', arguments.callee as any);\r\n                            });\r\n                            \r\n                            return;\r\n                        });\r\n                });\r\n            }\r\n        }\r\n        \r\n        return FormDecorator;\r\n    }\r\n}\r\n\r\n```"}}