2017-06-05 2 views
0

ich mit addItem bin mit einem Wert auf eine Liste von einer anderen Komponente esclassname angewendet, wenn „addItem“

Ich füge zu this.state.movies hinzuzufügen. Es scheint, aber es hat die inaktive/noresults className auf es angewendet.

Wie kann ich bestimmen, welches Styling auf ein Objekt angewendet wird, das noch nicht erschienen ist (z. B. mit addItem)? Danke

Volles Beispiel auf Codesandbox ist hier. Fügen Sie eine movie in die Liste und Sie werden sehen, es den stying angewendet wird: https://codesandbox.io/s/3OGK2pP9

Geordnete Komponente, wo ich das Element hinzufügen

<CreateNew addItem={item => this.setState({ movies: [{ name: item.value.name, genres: item.genres }].concat(movies,), })} /> 

Kinderkomponente, die das Element

class CreateNew extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     value: '', 
     genres: '', 
    }; 
    } 
    handleSubmit1 = (e, value) => { 
    e.preventDefault(); 
    this.props.addItem(this.state); 
    }; 
    onChange = e => { 
    this.setState({ 
     value: { name: e.target.value }, 
     genres: [{ name: 'Test', type: 1 }, { name: 'Foo', type: 10 }], 
    }); 
    }; 
    render() { 
    const { value, genres } = this.props; 
    return (
     <form onSubmit={this.handleSubmit1}> 
     Add a new movie 
     <input onChange={this.onChange} value={value} type="text" /> 
     <button type="submit">Add</button> 
     </form> 
    ); 
    } 
} 

Antwort

0

verwandten schafft War zu filtern auf meinem const x anstelle meines Zustandes this.state.movies.

Ich habe es von const filteredResults = andFilter({x}, Object.keys(selectedFilters)); zu `const filteredResults = andFilter ({this.state.movies}, Object.keys (selectedFilters));

+0

Haben Sie gefunden, was los ist? –

+0

Ja - ich habe das Ergebnis nicht auf meinen Zustand angewendet - ich habe es von 'const filteredResults = andFilter ({x}, Object.keys (selectedFilters));' zu 'const filteredResults = andFilter ({this.state.movies} , Object.keys (selectedFilters)); – Ycon

Verwandte Themen