TypeScript(泛型):数组推断类型的错误

时间:2019-02-28 18:43:08

标签: typescript typescript-generics

我有typescript@3.4.0-dev.20190228。

以下代码中打字稿的工作是难以理解的:

class InitialFilter extends Component {

    constructor(props) {
        super(props);
        this.state = {
            modal: false,
            unmountOnClose: true
        };

        this.toggle = this.toggle.bind(this);
        this.changeUnmountOnClose = this.changeUnmountOnClose.bind(this);
    }

    toggle() {
        this.setState(prevState => ({
            modal: !prevState.modal
        }));
    }

    changeUnmountOnClose(e) {
        let value = e.target.value;
        this.setState({ unmountOnClose: JSON.parse(value) });
    }

    render() {
        return (
            <div>
                <Form inline onSubmit={(e) => e.preventDefault()}>
                    <FormGroup>
                        <Label for="unmountOnClose">UnmountOnClose value</Label>{' '}
                        <Input type="select" name="unmountOnClose" id="unmountOnClose" onChange={this.changeUnmountOnClose}>
                            <option value="true">true</option>
                            <option value="false">false</option>
                        </Input>
                    </FormGroup>
                    {' '}
                    <Button color="danger" onClick={this.toggle}>{this.props.buttonLabel}</Button>
                </Form>
                <Modal isOpen={this.state.modal} toggle={this.toggle} className={this.props.className} unmountOnClose={this.state.unmountOnClose}>
                    <ModalHeader toggle={this.toggle}>Modal title</ModalHeader>
                    <ModalBody>
                        <Input type="textarea" placeholder="Write something (data should remain in modal if unmountOnClose is set to false)" rows={5} />
                    </ModalBody>
                    <ModalFooter>
                        <Button color="primary" onClick={this.toggle}>Do Something</Button>{' '}
                        <Button color="secondary" onClick={this.toggle}>Cancel</Button>
                    </ModalFooter>
                </Modal>
            </div>
        );
    }
}

另请参见Playground TypeScript上的此代码。

  1. 为什么class Container<T = any> { constructor(private parent: Parent<T>) {} } class Parent<T = any> { constructor(private children: Child<T>[]) {} } class Child<T = any> { constructor(private model: T) {} } class Model1 { prop1: string = ''; prop2: number = 123; } class Model2 { otherProp1: boolean = true; otherProp2: object = {}; } const parentInstance = new Parent<Model1>([ new Child(new Model2()), // Error --> It's OK new Child(new Model1()), new Child(new Model1()), ]); const containerInstance = new Container<Model2>( new Parent([ new Child(new Model2()), // Error --> Why!? new Child(new Model1()), new Child(new Model1()), ]) ); 的通用类型会忽略类型Container(请参见Model2设置)?
  2. 为什么当我将containerInstance的通用名称更改为Parent时,会影响Model2(请参见Container设置)吗?
  3. 为什么,当我更改设置parentInstance的顺序时,这很重要吗?
containerInstance

更新:我打开了issue on github

0 个答案:

没有答案