Habe ein Problem mit e.Ziel.Wert Rückkehr Undefiniert in Reagieren

Habe ich eine Funktion, wo Sie können klicken Sie auf ein img und sehen eine Liste der Namen, die anklickbar sind....wenn Sie auf einen Namen, dass Personen Bild sollte an die Stelle des original img. Im arbeiten mit einem Künstler-api und statt mir dann immer eine Fehlermeldung in der Konsole, das Bild verändert sich zu einer img-einer Künstlerin, deren name 'nicht definiert'...seltsam. könnte nicht eine große Lösung, aber ich war gequält von diesem Problem seit einiger Zeit.

searchForArtist(query) {
    request.get(`https://api.spotify.com/v1/search?q=${query}&type=artist`)
      .then((response) => {
        const artist = response.body.artists.items[0];
        const name = artist.name;
        const id = artist.id;
        const img_url = artist.images[0].url;
        this.setState({
          selectedArtist: {
            name,
            id,
            img_url,
          },
        });
      })
      .then(() => {
        this.getArtistAlbums();
      })
      .catch((err) => {
        console.error(err);
      });
  }

  getSubsequentCollabs(artist) {
    this.setState({
      selectedArtist: {},
      selectedAlbums: {},
      artistCounts: {},
    });
    console.log(artist);
    this.searchForArtist(artist);
  }

  artistOnClick(e) {
    console.log(e);
    let artist = e.target.value;
    this.getSubsequentCollabs(artist);
  }

Habe ich ein weiteres Bestandteil, dies zu tun:

const Artist = ({name, artistOnClick}) => {
  return (
    <div name={name} onClick={artistOnClick}>
      {name}
    </div>
  )
}

export default Artist;

Hören Sie eine div Komponente 'onclick' event. was erwartest du, was auf e.target.value ?!
Es tut mir Leid, kannst du das etwas erläutern oder helfen, ein wenig mehr mit. Ich habe nicht so viel Erfahrung wie Sie.
vielleicht eine andere Lösung ... e.nativeEvent.target.name

InformationsquelleAutor Mshark | 2016-11-05

e onclick reactjs target

event.target geben Sie die Ziel - HTML element. Javascript alle Attribute des Knotens als eine Eigenschaft von event.target.

Beispiel:

<div id="hello">Hello</div>

e.target.id //returns 'hello'

Gibt es spezielle Fälle, wie inputs wo sich die Immobilie value im impliziten. Aber auch für andere HTML-element müssen Sie die Attribute angeben, die ausdrücklich zu.

So, Sie HTML sollte das so sein

const Artist = ({name, artistOnClick}) => {
  return (
    <div value={name} onClick={artistOnClick}>
      {name}
    </div>
  )
}

e.target.value //return the name

ODER

const Artist = ({name, artistOnClick}) => {
  return (
    <div onClick={() => artistOnClick(name)}>
      {name}
    </div>
  )
}

e.target.name //returns the name

Hoffe, das hilft!

InformationsquelleAutor Pranesh Ravi

1

Einem div-element nicht mit einem value-Attribut, und so wird nichts weitergeleitet werden, die auf der Rückseite ein event-Objekt, für das jeweilige Ereignis klicken.

Je nachdem, was Sie erwarten, könnten Sie es angehen, indem er etwas wie:
```
const Artist = ({name, artistOnClick}) => {
  return (
    <div onClick={() => artistOnClick(name)}>
      {name}
    </div>
  )
}

export default Artist;
```
InformationsquelleAutor Chris

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.