Question

我想在不使用API的情况下使用react-native从网站获取数据。为什么会出现这个错误？我究竟做错了什么？还有其他获取数据的方法吗？我想做的移动应用程序还想从网站上获取某些区域。

ESLint解析错误：意外的令牌，预期为“（”（致命）错误行：async function loadGraphicCards() {

这是我的.eslintrc.json文件：

{
"extends":"rallycoding",
"eslint":"recommended",
"plugin":"react/recommended",
"env": {
"browser": true
}
}

这是完整的代码：

import React, { Component } from 'react';
import { ScrollView, TouchableOpacity, Image, Text } from 'react-native';
import cheerio from 'react-native-cheerio';

export default class App extends Component {
constructor(props) {
super(props);
this.state = {
page: 0,
items: [],
};
}
componentDidMount() {
this.loadNextPage();
}
async function loadGraphicCards() {
const searchUrl = 'https://www.amazon.de/s/? 
page=${page}&keywords=graphic+card';
const response = await fetch(searchUrl);  // fetch page

const htmlString = await response.text(); // get response text
const $ = cheerio.load(htmlString);       // parse HTML string

return $('#s-results-list-atf > li')             // select result <li>s
 .map((_, li) => ({                      // map to an list of objects
   asin: $(li).data('asin'),
   title: $('h2', li).text(),
   price: $('span.a-color-price', li).text(),
   rating: $('span.a-icon-alt', li).text(),
   imageUrl: $('img.s-access-image').attr('src')
 }));
}

loadNextPage = () =>
this.setState(async state => {
  const page = state.page + 1;
  const items = await loadGraphicCards(page);
  return { items, page };
});

render() {
return (
<ScrollView>
  {this.state.items.map(item => <Item {...item} key={item.asin} />)}
</ScrollView>
);
}
}

const Item = props => (
<TouchableOpacity onPress={() => alert('ASIN:' + props.asin)}>
<Text>{props.title}</Text>
<Image source={{ uri: props.imageUrl }} />
<Text>{props.price}</Text>
<Text>{props.rating}</Text>
</TouchableOpacity>
);

Answer 1

使用async function loadGraphicCards() {}代替使用loadGraphicCards = async () => {};

您使用的代码在语法上不正确。

React Native Eslint解析错误：意外的令牌，预期为“（”（致命）

1 个答案: