Vk mini apps HTTP запрос, как реализовывается?

Question

[sema-fedotov]

Здравствуйте, имеет следующий код в App.js

const App = () => {
	const [activePanel, setActivePanel] = useState('home');
	const [fetchedUser, setUser] = useState(null);
	const [popout, setPopout] = useState(<ScreenSpinner size='large' />);
	const [data, setData] = useState(null);

	useEffect(() => {
		bridge.subscribe(({ detail: { type, data }}) => {
			if (type === 'VKWebAppUpdateConfig') {
				const schemeAttribute = document.createAttribute('scheme');
				schemeAttribute.value = data.scheme ? data.scheme : 'client_light';
				document.body.attributes.setNamedItem(schemeAttribute);
			}
		});
		async function fetchData() {
			const user = await bridge.send('VKWebAppGetUserInfo');
			const _data = (await fetch('http://localhost:3000/user_info?user_id=1')).json()
			setData(_data)

			setUser(user);
			setPopout(null);
		}
		fetchData();

	}, []);

	const go = e => {
		setActivePanel(e.currentTarget.dataset.to);
	};

	return (
		<View activePanel={activePanel} popout={popout}>
			<Home id='home' fetchedUser={fetchedUser} go={go} data={data} />
			<Persik id='persik' go={go} />
		</View>
	);

}
export default App;

В нем есть кусочек, где идет отправление запроса на Node js^

const _data = (await fetch('http://localhost:3000/user_info?user_id=1')).json()
			setData(_data)

Проблема в том, что приложение не хочет загружаться, после добавления вот такой вот штучки, в приложении вечно крутится кружочек. Что можно предпринять? Как отправлять запрос, получить json, и раскидать данные в приложении?

Comments

[Даниил Маслов]

зачем вам локалхост при фетче данных?

Answer 1

[Сергей Ганин]

Попробуйте завернуть в try вашу штучку. Поглядеть что за ошибка. Похоже что запрос неудачный и ошибка не даёт коду исполнить следующие инструкции.

Comments

[sema-fedotov]

В принципе ничего такого, только вот этот варнинг выводит

./src/App.js
  Line 41:5:  React Hook useEffect has a missing dependency: 'data'. Either include it or remove the dependency array  react-hooks/exhaustive-deps