Question

我正在尝试获取缩略图路径并将其存储到要使用的变量中，但是却出现了 undefined

getThumbnail(filePath){
  let thumbnailURL = RNThumbnail.get(filePath)
    .then((response) => response.path)
    .then((responseData) => {
      console.warn(responseData);
      return responseData;
    }).catch(error => console.warn(error));
  alert(thumbnailURL);
  //return thumbnailURL;
}

Answer 1

.then不能那样工作，它不会返回值。您可以这样做：

  let thumbnailURL;

  RNThumbnail.get(filePath)
    .then((response) => response.path)
    .then((responseData) => {
      thumbnailURL = responseData;
      alert(thumbnailURL);
    }).catch(error => console.warn(error));

但是您必须在第二个then调用中继续进行计算，因为该值只能在那里可靠

最好使用async/await，只需将代码重构为：

async function getThumbnail(filePath){
  try {
    let thumbnailURL = await RNThumbnail.get(filePath)
    alert(thumbnailURL)
  } catch(err) {
    console.warn(err)
  }

详细了解async / await

Answer 2

对于React应用，您很可能希望将响应设置为状态：

state = {
  thumbnailURL: ''
}

getThumbnail = (filePath) => {
  RNThumbnail.get(filePath)
  .then(response => response.path)
  .then(responseData => {
      this.setState({
        thumbnailURL: responseData
      })
    })
  .catch(error => console.warn(error))
}

render() {
  return (
    <img src={this.state.thumbnailURL} />
  )
}

您将需要在getThumbnail上使用箭头功能进行词法绑定，以便可以访问this.setState()。

编辑：

您实际上无法立即使getThumbnail()返回thumbnailURL的值。 getThumbnail()可以返回承诺，您可以在想要访问thumbnailURL的地方将其解决：

getThumbnail = filePath => {
  return RNThumbnail.get(filePath)
    .then(response => response.path)
    .then(responseData => responseData)
    .catch(error => console.warn(error))
}

IWannaAccessThumbnailURLHere = () => {
  this.getThumbnail('....')
  .then(thumbnailURL => {
    // do things with thumbnailURL
  })
}

或者，使用setState重新渲染，然后您可以在下一个渲染周期访问this.state.thumbnailURL。

从那时起反应本地获取响应并分配给变量

2 个答案: