Question

如果搜索是空字符串或者无法从输入字段中的值中找到api的任何匹配，我如何捕获并向用户打印消息。

// show the search results from user input
const searchTvShows = ({ target }) => {
    fetch(`https://api.tvmaze.com/search/shows?q=${target.value}`)
        .then(blob => blob.json())
        .then(shows => {
        const app = document.getElementById('app');
        app.innerHTML = shows.map(({ show }) => `
            <div class="col-sm movie-content">
                <div class="movie-image">
                    ${show.image ? `<img src="${show.image.medium}">` : `<img class="fallbackImage"src="design/icons/No_image_available.svg">`}
                </div>
                <div class="movie-info">
                    <h1>${show.name}</h1>
                </div>
          </div>

        `).join(' ');
    })
  }

Answer 1

我刚检查过，当成功搜索不匹配时，您的API会返回一个空数组，所以：

if (shows.length) {
    // do what you're doing
} else {
    // show a message saying there were no matches
}

在上下文中，还处理我在my comment中提到的问题：

const searchTvShows = ({ target }) => {
  fetch(`https://api.tvmaze.com/search/shows?q=${target.value}`)
      .then(response => {
        if (!response.ok) {
          throw new Error();
        }
        return response;
      })
      .then(blob => blob.json())
      .then(shows => {
        const app = document.getElementById('app');
        if (shows.length) {
          app.innerHTML = shows.map(({ show }) => `
              <div class="col-sm movie-content">
                  <div class="movie-image">
                      ${show.image ? `<img src="${show.image.medium}">` : `<img class="fallbackImage"src="design/icons/No_image_available.svg">`}
                  </div>
                  <div class="movie-info">
                      <h1>${show.name}</h1>
                  </div>
            </div>
          `).join(' ');
        } else {
          app.innerHTML = "<em>No matching shows</em>";
        }
      })
      .catch(err => {
        // Report the error or similar
      })
}

如果if / else使用||对您很重要（对某些人来说似乎是这样），则可以避免使用const searchTvShows = ({ target }) => { fetch(`https://api.tvmaze.com/search/shows?q=${target.value}`) .then(response => { if (!response.ok) { throw new Error(); } return response; }) .then(blob => blob.json()) .then(shows => { const app = document.getElementById('app'); app.innerHTML = shows.map(({ show }) => ` <div class="col-sm movie-content"> <div class="movie-image"> ${show.image ? `<img src="${show.image.medium}">` : `<img class="fallbackImage"src="design/icons/No_image_available.svg">`} </div> <div class="movie-info"> <h1>${show.name}</h1> </div> </div> `).join(' ') || "<em>No matching shows</em>"; // *** }) .catch(err => { // Report the error or similar }) } / .join(' ')：

""

这是有效的，因为对于空数组，"" || "<em>...</em>"将返回"<em>...</em>"，这是假的，因此pos=nx.spring_layout(G) # filter and only draw positive edges positive_edges = [(u,v) for (u,v,d) in G.edges(data=True) if d['weight'] >0] nx.draw_networkx_nodes(G,pos) nx.draw_networkx_edges(G,pos,edgelist=positive_edges) plt.axis('off') plt.show()会导致nx.draw(G, only_positive_edge=True)。但是如果数组不是空的，那么你将有一个非空字符串，这将是真实的。

搜索是空字符串或API调用不匹配

1 个答案: