Adnotacja typu przepływu dla dzieci reaguje na elementy

Question

Czy istnieje lepszy sposób wpisywania-adnotacji children?

type FilterLinkProps={ 
    filter:State$VisibilityFilter, 
    children:any 
}; 

const FilterLink = ({ 
    filter, 
    children 
}:FilterLinkProps) => { 
    return (
    <a href='#' 
     onClick={e => { 
     e.preventDefault(); 
     store.dispatch(({ 
      type: 'SET_VISIBILITY_FILTER', 
      filter 
     }:Action$VisibilityFilter)); 
     }} 
    > 
    {children} 
    </a> 
); 
}; 

Answer 1

To nie wygląda.

Z oficjalnej React libdef:

declare module react { 
    declare var Children: any; 
    ... 
} 

a następnie

declare function cloneElement<Config> (
    element: React$Element<Config>, 
    attributes: $Shape<Config>, 
    children?: any 
): React$Element<Config>; 

Answer 2

Przepływ v0.53 obsługuje children wyjęciu z pudełka !!

import * as React from 'react'; 

type Props = { 
    children?: React.Node, 
}; 

Więcej informacji przeczytać official docs lub następujące blog post temat.

Dla starszych wersjach przepływu można wykonać następujące czynności:

import React from 'react'; 
import type { Children } from 'react'; 
type Props = { 
    children?: Children, 
}; 
const SampleText = (props: Props) => (
    <div>{props.children}</div> 
); 

obu przypadkach children powinny zostać uznane za rodzaj nullable.

Wygląda na to, że będą przesuwać niektóre elementy do przodu z nadejściem włókna, mam nadzieję, że to zrobią!

Po dyskusji w github

Ściągawka:http://www.saltycrane.com/blog/2016/06/flow-type-cheat-sheet/

Answer 3

type Text = string | number; 
type Fragment = Iterable<Node>; 
type ReactNode = React$Element<any> 
    | Text 
    | Fragment; 

ReactNode powinien być rodzaj dzieci, ale zastrzeżenie emptor.

Źródło: Widziałem tę konstrukcję w niektórych kwestiach github dotyczących repozytorium przepływu, jak sądzę.